Full Screen Background Image – pure CSS

Full Screen Background Image – Pure CSS Code.

CSS

html, body {
  height:100%;
  width:100%;
  padding:0;
  margin:0;
}

#full-screen-background-image {
  z-index:-999;
  min-height:100%;
  min-width:1024px;
  width:100%;
  height:auto;
  position:fixed;
  top:0;
  left:0;
}

#wrapper {
  position: relative;
  width:800px;
  min-height:400px;
  margin:100pxauto;
  color:#333;
}

 

HTML

<body>
  <imgalt="full screen background image"src="/background.jpg"id="full-screen-background-image"/>
  <divid="wrapper">
    <p>Content goes here...</p>
  </div>
</body>

Resources

This entry was posted in Uncategorized. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s