Hi everyone.

I'm trying to create a website with a 2x2 layout:

Top-left: logo
Top-right: navigation
Bottom-left: some pictures
Bottom-right: page content

Now, I have all these in a wrapper div.

The logo I set to float-left and that's fine and the navigation I set to float-right and that is fine too.

However I have a problem with the bottom divs: when I try setting the bottom left to float-left it seems to just stick to near the middle rather than the left of the wrapper div but it's still below the logo. It works fine (sticks to the left below the logo) without a float, but then how can I get the bottom-right div in place?

Any idea's what I can do?

Thanks.

Recommended Answers

All 4 Replies

have you tried setting clear ? depending if u fix the width of your wrappers or not you might need to clear:both; instead of clearing just left or right.

also just a personnal opinion but i usualy set all columns in my site float left with display:inline;

Hi,

Thanks. What I did was I created a div called "clear" and set the clear property to both and put <div id="clear" /> between the row.

Thanks!

mark this thread as solved if your problem is fixed please!

also some rep for a quick and helpful answer is always appreciated but optional ! :)

mark this thread as solved if your problem is fixed please!

also some rep for a quick and helpful answer is always appreciated but optional ! :)

To anyone willing to downrate posts for fun : have the balls to leave your name behind.

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.