Reputation: 1
I am making a website where I am aligning tables for my content. One table is used for a navigation bar and others are used for other content. Anyways, I have set these tables as float:left;
and at a position:relative;
.
The problem is, whenever I reposition the browser window all of the tables travel underneath the far left table. How can I fix this problem? I want it so the tables will not travel underneath each other.
For some odd reason this application will not allow me to post my code. I can post it, but it will not format the entire thing correctly.
Upvotes: 0
Views: 529
Reputation: 1544
Watson is correct, including the recommendation by Diodeus not to use tables for formatting. One way you can remedy the situation you're running into, though, is to wrap all your tables in a containing element (say, a div
) and then set a width
or min-width
css parameter that is equal to or slightly greater than the width needed for all your floated tables to fall into their proper location. What will happen then, is when the window is resized smaller than needed, you'll get a horizontal scroll bar but the positioning of the elements will remain intact.
Upvotes: 1
Reputation: 19358
This will happen if the width of the tables that are floated is greater than the width of their parent (the available space). Watch for padding, margin, border adding extra width. And follow Diodeus's advice, don't use tables for layout.
Upvotes: 1