Page 2 of 2 First 12
  • Jump to page:
    #16
  1. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2012
    Posts
    119
    Rep Power
    33
    OK, because you are floating you title it takes it out of the regular layout of the page, so if you want it to show in the header area (it is actually there but displaying white text on a white background) then you need to clear your floats or give your header a height.

    Using clear:

    Code:
    <!DOCTYPE html>
    <html> 
    <head> 
    <style type="text/css"> 
    .page { width: 100%; 
               margin-left: auto; 
               margin-right:auto; 
               background-color: #FFFFFF; } 
    #header { 
               border: thin solid #333;
               margin-bottom: 0px; 
               color: #000; 
               background-color: #333333;
               }
    #header h1 { 
              font: bold 24px/1.6em sans-serif;
              color: #FFFFFF; 
              line-height: 1.6em; 
              padding-left: 10px; }
    #title { 
              display: block; 
              float: left; 
              text-align: left; }
    .clear {
        clear: both;
    }
    </style> 
    </head> 
    <body> 
    <div class="page"> 
    <div id="header"> 
    <div id="title"> 
    <h1>Test Header for New Site</h1> 
    </div> 
    <div class="clear"></div>
    </div> 
    </div> 
    </body> 
    </html>​
  2. #17
  3. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2003
    Posts
    5
    Rep Power
    0
    Wow! Thank you - a learning experience indeed
Page 2 of 2 First 12
  • Jump to page:

IMN logo majestic logo threadwatch logo seochat tools logo