Div не заполняет 50% контейнера

1

Вам нужно добавить float:leftсвойства. Проверьте это:

.uno{
  background-color: blue;
  width: 50%;
  float:left;
}
.dos{
  background-color: green;
  width: 50%;
  float:left;
}
.super{
  width: 100%;
}
<div class="super">
      <div class="uno">
        aaaaaa
      </div>
      <div class="dos">
        bbbbb
      </div>
    </div>

0

Попробуйте это: поместите float: left и display: block, как показано ниже

.uno{
  background-color: blue;
  width: 50%;
  float:left;
  display:block;
}
.dos{
  background-color: green;
  width: 50%;
  float:left;
  display:block;

}
.super{
  width: 100%;
}
<div class="super">
      <div class="uno">
        aaaaaa
      </div>
      <div class="dos">
        bbbbb
      </div>
    </div>

0

Как говорилось ранее, попробуйте изменить «отображение» дочерних элементов на «block» и добавить «float»: «left» в css. Но у вас будет проблема - родитель будет вести себя так, как будто у него нет детей. Самый простой способ его исправить - добавить «переполнение»: «скрыто» в .super

0

@AFS, если вы используете float, вы теряете родительскую высоту. Решение с использованием flex.

.uno{
  background-color: blue;
  width: 50%;
}
.dos{
  background-color: green;
  width: 50%;
}
.super{
  width: 100%;
  display: flex;
}
    <div class="super">
      <div class="uno">
        aaaaaa
      </div>
      <div class="dos">
        bbbbb
      </div>
    </div>

JQuery, CSS,

jquery,css,

0

Ответов: 4

1

Вам нужно добавить float:leftсвойства. Проверьте это:

.uno{
  background-color: blue;
  width: 50%;
  float:left;
}
.dos{
  background-color: green;
  width: 50%;
  float:left;
}
.super{
  width: 100%;
}
<div class="super">
      <div class="uno">
        aaaaaa
      </div>
      <div class="dos">
        bbbbb
      </div>
    </div>

0

Попробуйте это: поместите float: left и display: block, как показано ниже

.uno{
  background-color: blue;
  width: 50%;
  float:left;
  display:block;
}
.dos{
  background-color: green;
  width: 50%;
  float:left;
  display:block;

}
.super{
  width: 100%;
}
<div class="super">
      <div class="uno">
        aaaaaa
      </div>
      <div class="dos">
        bbbbb
      </div>
    </div>

0

Как говорилось ранее, попробуйте изменить «отображение» дочерних элементов на «block» и добавить «float»: «left» в css. Но у вас будет проблема - родитель будет вести себя так, как будто у него нет детей. Самый простой способ его исправить - добавить «переполнение»: «скрыто» в .super

0

@AFS, если вы используете float, вы теряете родительскую высоту. Решение с использованием flex.

.uno{
  background-color: blue;
  width: 50%;
}
.dos{
  background-color: green;
  width: 50%;
}
.super{
  width: 100%;
  display: flex;
}
    <div class="super">
      <div class="uno">
        aaaaaa
      </div>
      <div class="dos">
        bbbbb
      </div>
    </div>

JQuery, CSS,
Похожие вопросы
Яндекс.Метрика