Подтвердить что ты не робот

Как установить минимальную высоту для div?

У меня есть страница, в которой расширяется контент из текущего div, соответствующий CSS также ниже. Просто удалив высоту: линия 510px позволит div развернуть по мере необходимости. Тем не менее, у новых пользователей, у которых нет контента, не будет высоты, и страница будет выглядеть неравномерно. Как установить минимальную высоту?

.Bb1
  {
  width:680px;
  height:510px;
  background-color:#ffffff; 
  float:left;
  border-right:3px solid #edefed;
  border-radius: 10px;
  }
4b9b3361

Ответ 1

CSS позволяет использовать свойство "min-height". Это можно использовать для установки минимальной высоты div, о котором вы говорите.

#div-id { min-height: 100px; }

Ответ 2

Если вы хотите установить минимальную/максимальную высоту и минимальную/максимальную ширину в div, CSS позволяет использовать определенную функцию.

Чтобы установить минимальную ширину div или любого другого элемента class/id/, используйте;

min-width: 150px;

Чтобы установить минимальную высоту div или любого другого класса /id/element, используйте;

min-height: 300px;

Аналогично для установки максимальной ширины и высоты div или любого другого класса /id/element используйте;

max-width: 600px;
max-height: 600px;

Важно:

Чтобы ваш div расширялся свободно по высоте и ширине после того, как данные доступны для пользователей; вам нужно будет установить ширину/высоту auto сразу после того, как вы установили min-width или min-height.

min-width: 300px;
width: auto;

min-height: 100px;
height: auto;

Ответ 3

min-height:510px;

css имеет атрибут min-height

Ответ 4

.comments { min-height:650px;height:auto; }


<div class="comments">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus. Morbi ut mi.</div>

Ответ 5

Здесь вы можете установить минимальную высоту div

<div id="bb1" style="min-height:200px;>
    .....
</div>

или примените

#bb1{
    min-height:200px;
}

если вы использовали класс

like

<div class="bb1"> 

в div, затем используйте

.bb1{
    min-height:200px;
}