Как заставить высоту отделения увеличиться для включения пущенного в ход изображения

Это - проблема. У меня есть отделение, которое включает несколько абзацев текста в нем и затем изображения, которое пускается в ход право. Изображение пускает в ход право, как оно должно, но содержание отделения не расширяется вертикально для размещения для изображения. Я знаю, что могу вручную установить высоту отделения, но это становится проблематичным, потому что я хотел бы использовать это то же отделение для каждой страницы моего сайта, и таким образом высоты должны будут отличаться.

Вот пример кода:

#main_contentbox {
  width: 918px;
  margin: 10px auto;
  padding: 10px 20px 20px 20px;
  background-color: #ffffff;
  border-style: solid;
  border-width: 1px;
  border-color: #000;
}

#main_contentbox img#sample {
  float: right;
}
<div id="main_contentbox">
  <h1 class="page"> The Event </h1>
  <img id="sample" src="sample.jpg" />
  <p>
    stackoverflow is awesome!stackoverflow is awesome!stackoverflow is awesome!stackoverflow is awesome!stackoverflow is awesome!stackoverflow is awesome!stackoverflow is awesome!</p>

  <p>stackoverflow is awesome!stackoverflow is awesome!stackoverflow is awesome!stackoverflow is awesome!


</div>
18
задан MJN Belief 4 February 2018 в 21:39
поделиться

3 ответа

С момента документации для Jslider и JComponent и т. Д. Не упоминают порядок уведомления слушателя, я бы не стеснялся полагаться на него, по крайней мере, без тщательного тестирования на каждой последующей версии JRE.

Если вам действительно нужно полагаться на заказ, рассмотрите возможность настройки цепочки слушателей, т.е. слушатель один уведомляет слушателя два и т. Д.

-121--3723776-

Вы можете изменить поведение того, как родительские блоки имеют дело с плаватешим содержанием, изменяя свойство , свойство . Это должно сделать это:

#main_contentbox { overflow: hidden; }
40
ответ дан 30 November 2019 в 06:29
поделиться

Использование : после псевдокласс, вы можете автоматически Добавьте четкое исправление. Добавьте это в свой файл CSS:

#main_contentbox:after {
  content: "Foo";
  visibility: hidden;
  display: block;
  height: 0px;
  clear: both;
}

с этим на месте вам не нужно ничего делать для силы main_contentbox , чтобы расти, чтобы содержать его поплавки, независимо от того, какую страницу вы находитесь.

2
ответ дан 30 November 2019 в 06:29
поделиться

Попробуйте что-нибудь с JavaScript может:

window.onload = FixMyDiv();

function FixMyDiv()
{
  var divh = document.getElementById('main_contentbox').style.offsetHeight;
  var imgh = document.getElementById('sample').style.offsetHeight;

  if(divh < imgh + 50) document.getElementById('main_contentbox').style.height = imgh + 50;


}
0
ответ дан 30 November 2019 в 06:29
поделиться