SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast
    Join Date
    Dec 2013
    Location
    Berlin
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Full height header

    Hey,

    I am searching for the code that sets the front page to the display height. For example: http://ournameismud.co.uk The light-blue section will always be as high as the display. height: 100% isn't working and min-height: 100% neither. What do I have to do to get this result?

    Thank you, Paul.

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,367
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Do you mean like this?

    Code:
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Untitled Document</title>
    <style>
    html, body {
    	margin:0;
    	padding:0;
    	height:100%
    }
    .wrap {
    	min-height:100%;
    	background:lightblue;
    }
    h1 { margin:0 }
    </style>
    </head>
    
    <body>
    <div class="wrap">
    		<h1>Test</h1>
    </div>
    <p>Stuff below the fold</p>
    <p>Stuff below the fold</p>
    <p>Stuff below the fold</p>
    <p>Stuff below the fold</p>
    <p>Stuff below the fold</p>
    </body>
    </html>

  3. #3
    SitePoint Enthusiast
    Join Date
    Dec 2013
    Location
    Berlin
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Exactly! Thank you.


Bookmarks

Posting Permissions

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