Gennemtrængning af flydende elementer gennem tags i CSS
Lad os nu antage, at teksten er placeret i afsnit,
og billedet, som har egenskaben float
anvendt, befinder sig over disse afsnit. I dette tilfælde
vil alt fungere, som det gjorde før - tilstedeværelsen
af andre tags forstyrrer ikke ombrydningen:
<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;
}
:
Lad os nu antage, at det første afsnit har lidt tekst - i dette tilfælde vil billedet trænge ind på det andet afsnit:
<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;
}
:
