Я хочу, чтобы div рядом с img был такой же высоты, при этом используя 100% ширины страницы

#html #onload

#HTML #onload

Вопрос:

Итак, что я собирался сделать, это:

 <div style="">
  <img src="rootfolder_wiki/img/DeadsideGun.jpg" style="float:left; width: 50%;" id="img">
  <div style="float: left; width: 50%; background-color: red; height: 100%;" id="kaka1" onload="document.this.style.height = h;"> Hello world </div>

</div>
<script type="text/javascript">
let h = 0;
function kaka() {
  h = document.getElementById("img").height;
  h = 20;
}

kaka1.addEventListener('load', kaka());
console.log(h);
</script>
 

любая помощь очень важна, пожалуйста, обратите внимание, что я довольно новичок в этом.

Ответ №1:

Вместо того, чтобы использовать float left, вам может оказаться полезным использовать flex вместо этого.

 <div style="display: flex;">
  <img src="rootfolder_wiki/img/DeadsideGun.jpg" style="width: 50%;" id="img">
  <div style="background-color: red;" id="kaka1" onload="document.this.style.height = h;"> Hello world </div>
</div>
 

Это поможет. Если вы в теме, я бы настоятельно рекомендовал научиться использовать flex и grid, а также CSS-файлы. Это может показаться лишним, но работать оказывается намного проще, чем просто добавлять стиль к объектам html.