www.webdeveloper.com
Results 1 to 4 of 4

Thread: make a div stick with the higher one

  1. #1
    Join Date
    Nov 2006
    Posts
    111

    Question make a div stick with the higher one

    Hi,

    under Joomla, i have 5 divs.
    - 1 on the top for main menu and banners
    - 1 on the left for my menu category,
    - 1 central for the content
    - 1 on the right for ads.
    - and 1 as footer

    as my content div heigh changes during the web browsing, i would like to make my left div (category menu) still reaching my footer div.
    this is needed because my left div as for background-color a different color than the content one.

    how can i do to make the left div everytime reaching the footer one even if my content div heigh is changing ?

    thanks a lot,
    A.

  2. #2
    Join Date
    Mar 2010
    Posts
    2,803
    I would use a layout something like this:

    I have left out the header and footer divs as they are independent of the left, central and right divs

    PHP Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
    >
    <
    html xmlns="http://www.w3.org/1999/xhtml">
    <
    head>
    <
    title></title>
    <
    style type="text/css">
    <!--
     
    #content {
    width100&#37;}
     
    #left {
    width100%;
    background-colororange;
    overflowhidden}
     
    #right {
    floatright;
    width25%;
    background-colorgreen}
     
    #central {
    floatright;
    width50%;
    background-colorblue}
     
    -->
    </
    style>
    </
    head>
    <
    body>
     
    <
    div id="content">
     
     <
    div id="left">
        
              <
    div id="right">
                 
    Some ads<br />
                 
    Some ads<br />
                 
    Some ads<br />
                 
    Some ads<br />
                 
    Some ads<br />
                 
    Some ads<br />
              </
    div>
        
              <
    div id="central">
                  
    your content<br />
                   
    your content<br />
                   
    your content<br />
                 
    your content<br />
                 
    your content<br />
                 
    your content<br />
                 
    your content<br />
                  
    your content<br />
              </
    div>
              
              <
    ul>
                       <
    li>Menu item 1</li>
                       <
    li>Menu item 2</li>
                        <
    li>Menu item 3</li>
                       <
    li>Menu item 4</li>
              </
    ul>       
      </
    div>
    </
    div>
     
    </
    body>
    </
    html

  3. #3
    Join Date
    Nov 2006
    Posts
    111
    unfortunately this means that my content div (holding all others) must include the different color... and this is not what i want as in other pages (generated by joomla) the background must be white... and i just want my left column to be light grey #f5f5f5;

  4. #4
    Join Date
    Mar 2010
    Posts
    2,803
    The colours I used are just for demonstration purposes.

    You can set the color in every div to whatver colour you like.

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