Как исправить: 2 DIV с поплавком не работает - PullRequest
0 голосов
/ 03 апреля 2019

У меня есть основное подразделение: панель-корпус и отделы внутри: упаковка Мой пакет отображается внутри корпуса панели, и они укладываются в ряд.

Вот живой сайт: https://royalkingdom.net/store/?cat=1

Я пытался добавить в свой пакет: float:left;, но когда я это делаю, пакеты не попадают в тело.

enter image description here

Если я удаляю float:left;, это работает, но их не три в строке

enter image description here

Мой пакет css:

.package {
    width: 33.33333333%;
}

Css моего тела:

.panel {
    margin-bottom: 30px;
    background: url(https://castiamc.com/buycraft/bordersv2/Middle.png);
    width: 850px;
    border: none;
    border-radius: 0;
    position: relative;
    min-height: 300px;
    padding: 20px;
    color: #fff;
}
.panel-body {
    padding: 15px;
    text-align:justify;
}
.panel .panel-body {
    color: #3d3e3f;
    box-sizing: border-box;
    position: relative;
    max-width: 750px;
    top: -75px;
    left: 13px;
}
<div class="package">
<img src="'.(isset($image) && $image!="" && ($it == 1 || $it == 3 || $it == IMG_JPEG) ? $image : "img/404.jpg").'" class="img-rounded img-responsive" style="width:250px; height:168px;">
</div>

Я хочу отобразить 3 пакета в строке внутри тела панели.

1 Ответ

0 голосов
/ 03 апреля 2019

В родительском пакете добавьте дополнительный класс с именем clearfix и определите этот класс в таблице стилей:

.clearfix:after {
  content: " ";
  display: block;
  clear: both;
}

По сути, плавающие элементы отбирают элементы из естественного потока родителя, поэтому добавление этого «заставляет» его вернуться к «нормальному» размеру.

...