2
I’m trying to float an element to the right, and this element is inside a div no set size. The problem is that when I float the element p to div does not follow the content.
Follow the HTML code:
<div id="divPrincipal">
<p>Conteúdo dentro da div</p>
</div>
And the CSS:
#divPrincipal{
border: 1px solid red;
}
#divPrincipal p{
border: 1px solid blue;
float: right;
}
How to solve this?
4
You need to clean up the float for the parent element to assume the size of their children with float. There are several ways to do this, but the most modern nowadays would be using something like this solution:
.cf:before,
.cf:after {
content: " "; /* 1 */
display: table; /* 2 */
}
.cf:after {
clear: both;
}
Where this CSS class would be added to its parent element, and HTML would look like this:
<div id="divPrincipal" class="cf">
<p>Conteúdo dentro da div</p>
</div>
Example: FIDDLE
Browser other questions tagged html css
You are not signed in. Login or sign up in order to post.
I tested the position, and applied on it a 1000px left. The contents came out of the div. This is because the element p is being treated as a block, I can define it with a display: table. It would be a solution. And on the width: 100%, did not solve the situation no.
– Wesley Redfield
After all, you are wanting to align the
divthe right or the elements ofdiv, or even both?– Paulo
The element! ;
– Wesley Redfield
Kazzkiq has already replied.
– Paulo