.wrapper { width: 100%; } .center { width: 70%; z-index: 0; } .user-message-trucated-text { max-width: 60vw; } @media screen and (min-width: 992px) { .user-message-trucated-text { max-width: 30vw; } .center { width: 40%; } } @media screen and (max-width: 576px) { .user-message-trucated-text { max-width: 70vw; } .center { width: 100%; } } #post-editor { min-height: calc(1em + 26px); } #title-image-preview { width: 100%; min-height: 100px; display: flex; flex-direction: row; justify-content: center; align-items: center; font-size: 50px; cursor: pointer; border: solid; border-width: 1px; } #title-image-preview i { opacity: 0.3; transition: opacity .3s; } #title-image-preview:hover i { opacity: 1.0; } #input-title-image { display: none; } #selected-title-image { width: 100%; display: none; } #title-image-block img { }