Pronikání plovoucích prvků přes tagy v CSS
Nyní předpokládejme, že je text umístěn v odstavcích
a obrázek, kterému je nastavena vlastnost float,
se nachází nad těmito odstavci. V tomto případě
vše bude fungovat, jako fungovalo dříve - přítomnost
dalších tagů nebrání obtékání:
<div>
<img src="img.png" alt="">
<p>
some long text
</p>
<p>
some long text
</p>
</div>
div {
width: 400px;
border: 1px solid red;
text-align: justify;
}
img {
float: left;
}
:
Nyní předpokládejme, že v prvním odstavci je málo textu - v tomto případě bude obrázek zasahovat i do druhého odstavce:
<div>
<img src="img.png" alt="">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elitorire.
</p>
<p>
some long text
</p>
</div>
div {
width: 400px;
border: 1px solid red;
text-align: justify;
}
img {
float: left;
}
: