CSS three column layout, liquid center, no left-margin! -


I am in favor of CSS based layouts, but this is the one I can not understand. With a table it's oh-so-easy:

   & Lt; Td style = "border: 1px solid blue, width: 200px;" Rowspan = "2" & gt; Rights & lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; Td style = "border: 1 px solid fuscia;" & Gt; Additional content & lt; / Td> & Lt; / TR & gt; & Lt; Tr & gt; & Lt; Td style = "border: 1 px solid green;" Callspan = "3" & gt; Footer & lt; / TD & gt; & Lt; / TR & gt; & Lt; / Body & gt; & Lt; Html & gt;  
  • Left default is
  • Correct default width
  • Content is liquid
  • Additional stuff sits below

    Now this important part is: "left" does not exist Again it is easy with tables. Delete the columns and expand the "content". beautiful. I have seen through many examples (and "holy grails") through liquid and table less three column CSS-based layouts, but I have not found anybody who has any kind of margin for the middle column ("content") - Not using the left. Any margin goes on left as a "left" "material" once it is left, just stay in its place.

    I am just going to switch to the old school table based layout for this problem, hopefully someone has any idea - I do not care much about markup, wrappers and likes, I Just want to know how to solve it with plain CSS. BTW: See how many equal height columns are ...

    Cheers

    No, please

    body {width: 600px; }. Left {float: left; Width: 200px; } .center {float: right; Width: 100%; } .right {float: right; Width: 200px; }
  • Should leave it. When the remainder is left, the center extends to the full width


    Comments

    Popular posts from this blog

    windows - Heroku throws SQLITE3 Read only exception -

    lex - Building a lexical Analyzer in Java -

    python - rename keys in a dictionary -