дочерние элементы элемента HTML с разным фоном при переносе строки - PullRequest
Новая
       51

дочерние элементы элемента HTML с разным фоном при переносе строки

1 голос
/ 27 мая 2020

Почему цвет фона у всех детей не такой же, как у родителей? HTML CSS, если между ними есть разрыв строки, например, если мой размер шрифта равен 20: 

<div style="background-color: rgba(0,0,0,0.5);font-size: 20px;"><span style="text-align:left; color: blue;">Roberto#3<span style="float:right;">18:21</span></span></div>

работает отлично, но если мой размер шрифта 130 

<div style="background-color: rgba(0,0,0,0.5);font-size: 130px;"><span style="text-align:left; color: blue;">Roberto#3<span style="float:right;">18:21</span></span></div>
и как это просто решить?

1 Ответ

2 голосов
/ 27 мая 2020

Ширина содержимого больше, чем у элемента, содержащего его, и он перемещается, он будет «переполняться» за пределами своего контейнера. Затем мы можем добавить overflow: auto; в содержащий элемент, чтобы исправить эту проблему: 

<div style="background-color: rgba(0,0,0,0.5);font-size: 130px; overflow: auto;"> 
  <span style="text-align:left; color: blue;">Roberto#3<span 
  style="float:right;">18:21</span></span></div>
...