Как красиво поступить с "лишними" буквами и словами ?

Kort

#47145 2023-09-28 08:09

Для начала закомментируй блоки .forum_date, .admin и div_thanks. Вернешься к ним потом.

Правила для div.about:

CSS

        
              .about {
 background-color: #2E3342;
 color: #D2E0A4ff;
 padding: 1rem;
 flex: 0 0 15rem;
}

Правила для div.message:

CSS

        
              .message {
 background-color: #2E3342;
 padding: 1rem;
 flex-grow: 1;
}

Текст в блоке .about теперь будет спокойно переноситься. Почему не переносился раньше -- почитай про flex и посмотри на свои начальные правила.

У родителя достаточно будет:

CSS

        
              .forum_post {
    display: flex;
    background-color: #2F3342;
    border-color: #3f4f5f;
    border-radius: 20px 8px 8px 0;
    box-shadow: 5px 3px 15px #00000080;
    opacity: 1.0;
    transition-duration: 0.5s;
    transition-property: box-shadow, opacity;
    transition: 200ms;
    margin: 30px 0;
}

.forum-date и .admin проще перенести в блок .message. .div_thanks -- в .about. Как вариант -- использовать отдельные рядные flex-блоки для [div.forum-date div.admin], [div.about div.message] и [div.thanks]. Но если посидеть-подумать, можно и с текущей разметкой справиться)

P.S. color для .about указан с ошибкой

SED.by - создание сайтов, разработка плагинов и тем для Котонти

This post was edited by Kort (2023-09-28 08:23, 1 year ago)

This topic is locked, new posts are not allowed.