Advertisement
Help Keep Boards Alive. Support us by going ad free today. See here: https://subscriptions.boards.ie/.
If we do not hit our goal we will be forced to close the site.

Current status: https://keepboardsalive.com/

Annual subs are best for most impact. If you are still undecided on going Ad Free - you can also donate using the Paypal Donate option. All contribution helps. Thank you.
https://www.boards.ie/group/1878-subscribers-forum

Private Group for paid up members of Boards.ie. Join the club.

cannot colour div container

  • 04-02-2006 07:44PM
    #1
    Closed Accounts Posts: 603 ✭✭✭


    Hi all. Bear with me, im new to this css positioning! consider the following code:
    
              body {
    		background-color: #CCCCCC;
    	  }
    	
    	  #page {
    		background-color:#FFFFFF;
    		position: absolute;
    		left: 10%;
    		right: 10%;
    		top: 21px;
    		width: 799px;
    		height: auto;
    	  }
    	  
    	  #contact {
    		position: absolute;
    		top: 65px;
    		right: 21px;
    	  }
    	  
    	  #logo {
    		position: absolute;
    		top: 2px;
    		left: 2px;
    	  }
    	  
    	  #banner {
    		position: absolute;
    		top: 106px;
    		left: 2px;
    	  }
    	  
    	  .nav1 {
    		border-right: thin dotted #6633FF;
    	  }
    ---------------------------------------------
    <body>
        <DIV id="page">
          <DIV id="logo">
            <img src="../logo.jpg" />
          </DIV>
          <DIV id="contact">
            <table width="10%" height="31">
              <tr>
                <td class="nav1">Home</td>
                <td>Contact</td>
              </tr>
            </table>
          </DIV> 
          <DIV id="banner">
            <img src="../banner.jpg" /> 
          </DIV>
      </DIV>
    

    I have the body set as a gray colour.The main container's (page) background colour is set to white. Now as i am adding smaller containers that contain images, tables etc, they are showing up in all the right positions etc but the page container hasnt got the white background.it just appears transparent and the only present colour is the gray background from the body.Can anyone help me out as to why this is happening? if i remove the two containers (DIV id="logo" and DIV id="banner") from the images, the main container shows up with a white background!Please help! many thanks,
    shamrock


Comments

  • Registered Users, Registered Users 2 Posts: 4,480 ✭✭✭wheres me jumpa


    not sure but you may need to format the table. i.e. assign it a class where you specify the background color, font etc.


  • Registered Users, Registered Users 2 Posts: 5,333 ✭✭✭Cake Fiend


    I have a feeling the absolute positioning is stopping your 'height: auto' property of the page selector from working properly. Since there's technically nothing in the page container, the height is 0. Give it an absolute height and it should display.


  • Closed Accounts Posts: 603 ✭✭✭shamrock2004


    That makes sense alright sico. Ill give that a try this evening and see how i get on.Thanks for the help guys,
    regards


  • Closed Accounts Posts: 603 ✭✭✭shamrock2004


    yup that worked sice.nice simple fix.thanks for that.
    regards
    Shamrock


Advertisement