Floating Elements Penetrating Through Tags in CSS
Let's say now that we have text placed in paragraphs, and the image, which has the float property, is located above these paragraphs. In this case, everything will work as it did before - the presence of other tags does not interfere with the wrapping:
<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;
}
:
Let's say there is little text in the first paragraph - in this case the picture will also climb into the second paragraph:
<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;
}
:
