@saintpat
Верстальщик

Работа с флоат. Почему блок растягивается, а контент уезжает вниз?

Меня интересует почему страница себя так ведет. Ниже в картинках опишу.
Вот кусок кода с которым страница отображается в нужном результате:

section {
float:right;
background:#808080;

width:45em;
}
section p {
margin-left:1em;
}

nav {
width:15em;
margin-top:4em;
padding-left:0;
color:#159498;

background:red;
}

2754eb4b98434227912efffac594d7f1.png
Но только стоит убрать ширину у section и добавить в нее margin-left:20 em;Получается вот так:6a589b71598647e992fc5a4bd8619748.png
А при добавлении overflow: hidden . Верхняя часть без контента скрывается, нижняя остается на месте. Вопрос собственно в том почему он себя так ведет и можно ли без добавления фиксированной ширины в section< воплотить в реальность первый вариант картинки. В nav лежит маркированный список с ссылками, если это важно. Заранее благодарю!
  • Вопрос задан
  • 404 просмотра
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы