0

Why doesn't the green background color appear? It seems that the float right is removing it.

UPDATE: I added overflow:hidden to the div and it now works. Can someone explain why?

.home-vision{
   background-color:#538231;
   color:black;
   font-size:2.25vw;
   overflow:hidden;
}

.hv1{
   display:inline-block;
   font-weight:bold;
   float:left;
   
}
.hv2{
   display:inline-block;
   width:85vw;
   float:right;      
}
<div class="home-vision">
   <span class="hv1">Our Vision:</span><span class="hv2">A sustainable and healthy town of Weston, with engaged citizens committed to a thriving community, today and in the future.</span>
</div>
DCR
  • 14,737
  • 12
  • 52
  • 115
  • quick fix; `overflow: hidden;` on the parent element but read the duplicate**s** to understand the *why* – Temani Afif Sep 15 '19 at 14:16
  • the *why* is on the duplicates, simply take the time to read them considering All the answers. You will also find many linked articles with more details but you won't be able to read and understand all this in only 5min – Temani Afif Sep 15 '19 at 14:26

0 Answers0