Can anyone explain why if I apply style to a <p> to "display: inline" it overflows outside its containing block?

#iaminline{display:inline;}

<div>
<p id="iaminline">hola!</p>
</div>

The result has overflow, while "display:black" is completely contained in the containing block. I want to have inline elements completely inside the containing block. Thanks!

Dat0,

Block elements restyled as inline render unreliably. It's best not to do it.

Where possible use an inline elemt in the first place - notably <span>.

Unfortunately, if the (X)HTML/XML is not under your control then you are constrained.

Airshow

Thank you. Solved.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.