Redesign Table (dynamic width) with Div tags?

Here's a variety of CSS layouts that should do exactly what you want: CSS Easy You're probably looking for #4 under the fixed or fluid layouts.

This will allow your right, fixed-width column to fit in the margin of your other column, and therefore be on the same line: #right { float:right; width:18em; } #body { margin-right: 20em; //IE calculates padding into the width, so you need a buffer unless you set body's padding to 0 } Now the body's div, which defaults to 100% screen width, will be fluid, and your right column will be fixed width.

Add a clear:both to your right column. To manage the height of having a float at the bottom of your main content area use a clearfix. Also, since you want the right column to float underneath the left column, there's no need to float the left column?

1 Thx for the answer apphacker, but normally I would like to display the right pane on the right of the content. (only on small screens I would like the alternate layout) The clear:both does not enable that. – GvS May 5 '09 at 14:22 The only way to do that is to use JavaScript.

– apphacker May 6 '09 at 2:43.

Try this code: Пример HEADER MENU (side bar) INFO (central pane) FOOTER.

– Zack May 5 '09 at 19:31 No, expressions are nessecary to fix ie6 problem (ie6 doesn't support min-width and max-width) – Roman May 5 '09 at 21:15 web expressions are bad ok. The browser executes the javascript everytime you resize the browser, change anything at all, look at it wrong. And they don't work in IE 8.

And what are you doing setting the width of the body element? Use a container. – apphacker May 6 '09 at 2:44 then give me another solution for IE6 – Roman May 6 '09 at 7:39 #container {min-width: 600px;} should work, then just wrap your elements in – S Pangborn Oct 16 '09 at 15:19.

Not tested (yet), but I think I have found the solution to the problem. alistapart.com/articles/holygrail/ This solutions allows to mix fixed and liquid layout (terms I learned from asking this question).

I also would like to use div tags instead of a table layout. On a mobile phone, the Div tags can be shown under each other, instead of side by side. (Text does not matter, only the layout, so I have shrunken it a bit).

How can I position the "right" bar, on the right of the content, while maintaining the dynamic width of the content, and not using table layout? What I actually want is the right pane appear on the right of the content, but when the browser is too small ( In the final Website the contents of the header / footer / content and right will be dynamically generated, so I cannot hardcode the height. Thx for all the answers, this really helps me forward.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.

Related Questions