CSS layout question

Discussion in 'Web Design and Development' started by Jas123, Mar 21, 2009.

  1. Jas123 macrumors member

    Joined:
    Apr 1, 2008
    #1
    I'm trying to create a layout that has two columns. I want the left column to remain fixed in width and have the other one expandable. I have both columns wrapped inside a div tag. The problem I have is with the expandable column. I've tried setting the width to 100%, but when I do this it wants to take up the whole space and not the 100% less the fixed width of the other column. I've set the width 50% but this causes it to not expand in proportion with other elements on the page. How can I fix this?
     
  2. Cabbit macrumors 68020

    Cabbit

    Joined:
    Jan 30, 2006
    Location:
    Scotland
    #2
    i suggest you look at this link it is very in depth css layouts
     
  3. Jas123 thread starter macrumors member

    Joined:
    Apr 1, 2008
    #3
    That's a good site to know about. I had not heard of it before. The article you gave me, however, does not seem to touch upon what i'm talking about. In it, they had all three columns expandable, whereas, i would want the left most column fixed, to say 100 pixels, and the other two columns expandable to whatever. Is it possible to do with a CSS layout? I've done it with tables, and am just not sure how to do with with CSS. Thanks for the reply.
     
  4. Cabbit macrumors 68020

    Cabbit

    Joined:
    Jan 30, 2006
    Location:
    Scotland
    #4
    Take another look, there is 2 column, 3 column layouts and options to have mixed em, % and full % and full em layouts to suite.

    Top tab to select amount of columns and "Measure columns in" change to Em widths. That will make 1 column fixed and the other flexible then you go to view source and copy the code to experiment with how it works.
     
  5. Jas123 thread starter macrumors member

    Joined:
    Apr 1, 2008
    #5
    Thanks again for the reply, I believe this is what I'm looking for. I did not notice the column measurements above. Thanks again, I appreciate your help.
     
  6. Jas123 thread starter macrumors member

    Joined:
    Apr 1, 2008
    #6
    After looking at the source code for a while, It seems that the method the site uses is quite convoluted. I feel that there is a more simple method to use. Can anyone provide me with an alternative solution or, if not, can someone describe to me, concept wise, how they implemented the layout at http://matthewjamestaylor.com/blog/ultimate-3-column-holy-grail-pixels.htm.

    Thanks in advance.
     

Share This Page