Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    ubh
    ubh is offline
    Regular Coder ubh's Avatar
    Join Date
    Apr 2008
    Location
    Portland, Oregon U.S.A.
    Posts
    443
    Thanks
    108
    Thanked 15 Times in 14 Posts

    3 column layout and width 100%

    God I don't know if I ever over came this problem before or just can't remember a solution I have floating up in my head somewhere but how the heck do I get a 3 column layout to work while the the middle column is at a width:100%?

    Here is my code:
    Code:
    	<div style="width:500px; position:relative;">
            <div style="width:20px; position:absolute; left:0px; height:20px;"></div>
                <div  style="height:20px; width:100%; margin:0 20px 0 20px; background-color:#000;">s</div>
            <div style="width:20px; height:20px; right:0px; position:absolute;"></div>
    	</div>
    So I have a content wrapper for the 3 columns in order to accomplish a relatively absolute position for the left and right column. Then I am setting the left and right columns to a width and height of 20px. I however need to have the center column be a width of a 100% but this breaks the right column if I use a left/right margin of 20px or not.

    How do I have a left column(20px) center column(100%) and right column (20px)??

    Thanks

  • #2
    ubh
    ubh is offline
    Regular Coder ubh's Avatar
    Join Date
    Apr 2008
    Location
    Portland, Oregon U.S.A.
    Posts
    443
    Thanks
    108
    Thanked 15 Times in 14 Posts
    DUH width:auto; ... why did I forget that.

    <-- calls doctor house.

  • #3
    Regular Coder
    Join Date
    Aug 2005
    Location
    MS
    Posts
    837
    Thanks
    11
    Thanked 79 Times in 77 Posts
    When I get a brain drain with that kind of problem, I go to Fixed Width CSS Layouts for a refresher. Lots of examples.
    ☠ ☠RON☠ ☠

  • #4
    Regular Coder
    Join Date
    Apr 2008
    Location
    Manila, Philippines
    Posts
    263
    Thanks
    3
    Thanked 12 Times in 12 Posts
    dunno what you're trying to get at.. but i think.. your method is wrong...

    using absolute positioning in attaining a 3 column layout.. is a definite no no..

    hmm.. let me rephrase that... using absolute positioning is a definite no no.. not unless there's no other way to fix your page...

    if i were you... i'll just float my divs... liquid style... ^__^

  • #5
    New Coder
    Join Date
    Feb 2008
    Posts
    55
    Thanks
    1
    Thanked 0 Times in 0 Posts
    i'm not see any margin left,center and right.
    you should put that in div = "center,left or right"/>
    Regards,
    D


  •  

    Posting Permissions

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