Проблема с версткой

Question

Проблема с версткой

Dlazder Мудрец (16929), на голосовании 1 год назад

Почему при вставке текста с margin внутрь блока текст не двигается вниз, двигается блок?
display block не помог, пока что использую padding

  
        Введение
 


.title {
        margin-top: 100px;
        font-weight: 700; 
        font-size: 56px; 
    }

Подскажите, чего я неучел, или где ошибся. Заранее спасибо за помощь!

Answer 1

AaacoB Aaac Мудрец (14208) 1 год назад

ты же тут самый вумный... советы всем даешь...

DlazderМудрец (16929) 1 год назад

Я так не считаю, да и не говорил никогда так, но спасибо!

Answer 2

Анти Советчик Искусственный Интеллект (129046) 1 год назад

Всё двигается.

DlazderМудрец (16929) 1 год назад

Двигается блок вниз, а я хочу чтобы двигался текст вниз. можно конечно padding использовать, но почему с margin не работает?

Анти СоветчикИскусственный Интеллект (129046) 1 год назад

Какой блок? p или section?
p должен двигаться.

Dlazder Мудрец (16929) Анти Советчик, А двигается section.

Answer 3

  
Введение

Answer 4

Ваша проблема заключается в том, что вы используете margin-top для параграфа с классом title, который наследует свойство display: block от родительского элемента section. Это означает, что параграф занимает всю ширину родительского блока и отталкивает его вниз на 100px.

Если вы хотите, чтобы текст внутри параграфа сдвинулся вниз, а не сам блок, то вам нужно использовать padding-top вместо margin-top. Таким образом, вы добавите внутренний отступ сверху к параграфу и текст будет расположен ниже.

Вот как выглядит ваш код с padding-top:

<section class="block2">
<p class="title">Введение</p>
</section>

.title {
padding-top: 100px;
font-weight: 700;
font-size: 56px;
}

Надеюсь, это поможет вам решить вашу проблему. Удачи! ?