floated divs are not contained inside post div container

Can you use overflow: hidden; to the white background element?

That worked but my container is now like 50px wide and floated all the way to the right.

Was I supposed to contain the floated divs on the page inside another div?

I hope not because that means I have to go back to every page and add the wrapper div.

iso

So something like:

.container_for_floated_products{

}

I just don’t know the trick to make this work.
width?
Height?

iso

Check if the page has valid markup first
https://validator.w3.org/

@isonychia — Not sure I’m understanding the problem, but why can’t you just apply the white background to the floated elements?

If you can post a link to your site, it will be much easier for people to offer specific help.

This is the problem I’m having:

https://stackoverflow.com/questions/2062258/floating-stuff-within-a-div-floats-outside-of-div-why

I will try the overflow but I thought I tried that and it didn’t work.

Here’s the page:

I tried overflow hidden and it didn’t work.

If I do this it works but I’m not sure thats right.
.post-text{
background-color:#ffffff;
float:left;

}

All I want is to be able to do is float one div left, then float one right next to it, then under those two float another div left WHILE keeping all the content inside the .post-text div

I never ran into this problem before in wp but I never created floated divs inside the content area.

It just seems wrong to modify the content div(post-text) which is why I figured I should probably have wrapped those 3 divs inside a wrapper div inside the content div. Hope that made sense.

What I should have done is stuck to tables, but I didn’t want to use tables because I constantly read I shouldn’t but then I have to float stuff and then I run into problems. Sometimes this web stuff is so complicated just to do simple things it’s really annoying. So many rules/problems just to get 2 boxes lined up next to each other.

iso

I currently left the page I posted with the float fix, so thats why it looks like it’s fixed.

iso

I removed the float and tried this, see below. (this may be an old school hack)I would be open to a better option if one exists.

————–
CSS Container and float DIV

A common problem with the floating div element is that the floats’ container does not stretch up to accomodate the float. If you set a background image to the container div, you will notice that the float div appears outside of container.

The solution is to add an extra div element with clear: both after the floating elements. The element with this property doesn’t allow other elements floating upon it and so it will stretch the container to suit the floating div.
————–

iso