www.webdeveloper.com
Results 1 to 5 of 5

Thread: Arranging DIVs

  1. #1
    Join Date
    Aug 2006
    Posts
    89

    Arranging DIVs

    I am trying to center three DIVs on a page but I need each div to be able to automatically resize itself vertically to accommodate the amount of content it holds (which will change). Every time I try to float them, the parent container (the one centering them) will stop holding them.

    (Refer to attached file for clarification)

    Any help would be appreciated.
    Attached Images Attached Images

  2. #2
    Join Date
    Jun 2008
    Location
    Texas
    Posts
    84
    Quote Originally Posted by meinsla
    I am trying to center three DIVs on a page but I need each div to be able to automatically resize itself vertically to accommodate the amount of content it holds (which will change). Every time I try to float them, the parent container (the one centering them) will stop holding them.

    (Refer to attached file for clarification)

    Any help would be appreciated.
    I am sure I can help, but I am gonna need source code...

  3. #3
    Join Date
    Jun 2008
    Location
    Texas
    Posts
    84

    Here you go

    HTML:
    HTML Code:
    <div id="pageWrapper">
    	<div id="leftColumn">
    		<div id="whateverContainer"></div>
    	</div>
    	<div id="middleColumn">
    		<div id="whateverOtherContainerOne"></div>
    		<div id="whateverOtherContainerTwo"></div>
    	</div>
    	<div id="rightColumn">
    		<div id="YouGetTheIdea"></div>
    	</div>
    	<div id="anythingBelow"></div>
    </div>
    and here is the CSS

    Code:
    body {
    background-color:#fffff7;
    text-align:center;
    }
    #pageWrapper {
    width:960px;
    margin:0pt auto;
    position:relative;
    text-align:left;
    background-color:#fffff7;
    }
    
    #leftColumn, #middleColumn {
    float:left;
    width:315px;
    }
    
    #rightColumn {
    float:right;
    width:315px;
    }
    
    #anythingBelow {
    clear:both;
    
    }
    Ok, that was some like 2 minute hand coding....but you should get the idea...

  4. #4
    Join Date
    Aug 2007
    Posts
    3,767
    EDIT: Said what chadsten did.
    Last edited by Declan1991; 07-07-2008 at 11:53 AM.

  5. #5
    Join Date
    Aug 2006
    Posts
    89
    Fantastic. Thanks for your help, chadsten.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles