Hello everyone I'm new here, I will try as best I can to describe the situation I'm dealing with, I'm not allowed to post the exact website and code as it's not mine.
So I have the main div area in black. 4 divs inside that with images and html. Then several p areas below that in the html with no css it appears. These are controlled by wordpress so I'd like to get the css sorted so that it works when more divs are added or more p writing.
The two blue divs have float:left assigned in their css, and the two red divs have float:right assigned, all 4 have width:43% in their local style setting. I can't see anything of any other significance in the css, there is padding and colours etc.
As you can see in the example below whats going on is the bottom blue left Div is moving to the right side.
When I add clear:both to the left hand side css it does jump back to the left side. But the p areas still invade between the top and bottom divs on the right side.
What I'd like to do is arrange it as it is below. But also so that any new divs and p areas that are inserted in the back end of wordpress as posts etc. will align also correctly as in the image below. Most importantly I'd like to understand why this is all happening!