Advanced Search

Results 1 to 3 of 3

Thread: Two colums layout, content column needs to be fluid but no margins can be used.

  1. #1
    Join Date
    Apr 2006
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Two colums layout, content column needs to be fluid but no margins can be used.

    Hello guys,
    I am trying to make a layout with two colums, a menu and the content column.
    The menu will have a button that will completely collapse it (like the lateral menu on www.webmastershelp.com ).

    I need the content column to fill the empty space left when the menu is collapsed.

    The normal way to make the two columns layout would be something like this:



    The problem is that if i set a right margin to the content area it will not fill the empty space left when the menu is collapsed.
    If i put no margin the menu will appear over the content.

    So my question is this, ¿is there any way to make it so that the content area will fill all the screen but will not be under the menu, and also when the menu collapses it'll fill the empty space?.

    I have done this before but using tables, i want to use divs as css now.
    Thanks in advance.
    Gaston

  2. #2
    Join Date
    Oct 2006
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default 2 Column Layout Question

    Hi:

    I'm really new to CSS so I can't answer your question.

    But can I ask one:

    The layout you posted is exactly what a new client of mine is looking for.

    I have looked at the 2 column layouts on DD, but I can't find one that has the seperation between the cloumns like yours does.

    Can you tell me how you achieved the effect and where I might be able to look at a copy of the source code.

    Thanks,

    SP

  3. #3
    Join Date
    Apr 2006
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hello spacepoet,
    In the example i posted the lateral column has fixed with of 60px, and the main content column is fluid because no width was specified.
    To leave a margin between the columns you only need to make bigger the right margin of the content div.

    Here is a sample layout with header and footer:
    http://www.webmastershelp.com/csslay...mns_fixed.html

    Let me know if that's what you are looking for.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •