Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
<style type="text/css">
  /*
    Tag Edits
*/
body{
    min-width: 920px;
}
/*
    Image Containers
*/
#headercontainer {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 150px;
    background-color: red;
    display: block;
}
#header {
    position:relative;
    width: 920px;
    height: 100%;
    margin: 0 auto;
    display:block;
}
#navbar {
    position: absolute;
    right: 0px;
    width: 500px;
    top: 60px;
    height: 50px;
    background-color: blue;
    display: block;
}
#content-wrapper {
    position: absolute;
    top: 150px;
    width: 920px;
    margin-left: 50%;
    left: -460px;
    background-color: brown;
    display: block;
}
#footer {
    margin-top: 400px;
    clear: both;
    text-align: center;
        background-color: black;
    background-repeat: repeat-x;
    width: 100%;
    height: 75px;
}
  </style>
</head><body>
    <div id="headercontainer">
        <div id="header">
        </div>
    </div>
    <div id="content-wrapper">
        <p>Etiam eget quam eu elit mollis tristique. Morbi at nulla dolor, eu lacinia augue. Donec sapien erat, fringilla at pulvinar id, ultrices eu massa. Etiam quis ipsum ante. Duis blandit laoreet sem ut porta. Duis mattis velit id ante fermentum lacinia. Proin justo ante, malesuada vitae tincidunt et, vestibulum a eros. Ut vestibulum turpis lorem, non venenatis ante. Integer at posuere lectus. Donec vulputate lorem in mauris tempus accumsan. Curabitur vehicula mauris nec velit tincidunt condimentum consequat sit amet augue. Vestibulum vulputate adipiscing justo, ut mattis leo iaculis in. Suspendisse venenatis pellentesque urna dapibus sodales. Cras iaculis, nunc at convallis hendrerit, lectus urna vestibulum metus, vitae pellentesque mi urna at ante. Quisque euismod, urna vel euismod gravida, lectus est faucibus turpis, quis faucibus turpis dui vestibulum diam. Ut vitae ligula viverra urna porttitor convallis non suscipit augue.</p>
        <p>Etiam eget quam eu elit mollis tristique. Morbi at nulla dolor, eu lacinia augue. Donec sapien erat, fringilla at pulvinar id, ultrices eu massa. Etiam quis ipsum ante. Duis blandit laoreet sem ut porta. Duis mattis velit id ante fermentum lacinia. Proin justo ante, malesuada vitae tincidunt et, vestibulum a eros. Ut vestibulum turpis lorem, non venenatis ante. Integer at posuere lectus. Donec vulputate lorem in mauris tempus accumsan. Curabitur vehicula mauris nec velit tincidunt condimentum consequat sit amet augue. Vestibulum vulputate adipiscing justo, ut mattis leo iaculis in. Suspendisse venenatis pellentesque urna dapibus sodales. Cras iaculis, nunc at convallis hendrerit, lectus urna vestibulum metus, vitae pellentesque mi urna at ante. Quisque euismod, urna vel euismod gravida, lectus est faucibus turpis, quis faucibus turpis dui vestibulum diam. Ut vitae ligula viverra urna porttitor convallis non suscipit augue.</p>
        <p>Etiam eget quam eu elit mollis tristique. Morbi at nulla dolor, eu lacinia augue. Donec sapien erat, fringilla at pulvinar id, ultrices eu massa. Etiam quis ipsum ante. Duis blandit laoreet sem ut porta. Duis mattis velit id ante fermentum lacinia. Proin justo ante, malesuada vitae tincidunt et, vestibulum a eros. Ut vestibulum turpis lorem, non venenatis ante. Integer at posuere lectus. Donec vulputate lorem in mauris tempus accumsan. Curabitur vehicula mauris nec velit tincidunt condimentum consequat sit amet augue. Vestibulum vulputate adipiscing justo, ut mattis leo iaculis in. Suspendisse venenatis pellentesque urna dapibus sodales. Cras iaculis, nunc at convallis hendrerit, lectus urna vestibulum metus, vitae pellentesque mi urna at ante. Quisque euismod, urna vel euismod gravida, lectus est faucibus turpis, quis faucibus turpis dui vestibulum diam. Ut vitae ligula viverra urna porttitor convallis non suscipit augue.</p>
        <p>Etiam eget quam eu elit mollis tristique. Morbi at nulla dolor, eu lacinia augue. Donec sapien erat, fringilla at pulvinar id, ultrices eu massa. Etiam quis ipsum ante. Duis blandit laoreet sem ut porta. Duis mattis velit id ante fermentum lacinia. Proin justo ante, malesuada vitae tincidunt et, vestibulum a eros. Ut vestibulum turpis lorem, non venenatis ante. Integer at posuere lectus. Donec vulputate lorem in mauris tempus accumsan. Curabitur vehicula mauris nec velit tincidunt condimentum consequat sit amet augue. Vestibulum vulputate adipiscing justo, ut mattis leo iaculis in. Suspendisse venenatis pellentesque urna dapibus sodales. Cras iaculis, nunc at convallis hendrerit, lectus urna vestibulum metus, vitae pellentesque mi urna at ante. Quisque euismod, urna vel euismod gravida, lectus est faucibus turpis, quis faucibus turpis dui vestibulum diam. Ut vitae ligula viverra urna porttitor convallis non suscipit augue.</p>
        <p>Etiam eget quam eu elit mollis tristique. Morbi at nulla dolor, eu lacinia augue. Donec sapien erat, fringilla at pulvinar id, ultrices eu massa. Etiam quis ipsum ante. Duis blandit laoreet sem ut porta. Duis mattis velit id ante fermentum lacinia. Proin justo ante, malesuada vitae tincidunt et, vestibulum a eros. Ut vestibulum turpis lorem, non venenatis ante. Integer at posuere lectus. Donec vulputate lorem in mauris tempus accumsan. Curabitur vehicula mauris nec velit tincidunt condimentum consequat sit amet augue. Vestibulum vulputate adipiscing justo, ut mattis leo iaculis in. Suspendisse venenatis pellentesque urna dapibus sodales. Cras iaculis, nunc at convallis hendrerit, lectus urna vestibulum metus, vitae pellentesque mi urna at ante. Quisque euismod, urna vel euismod gravida, lectus est faucibus turpis, quis faucibus turpis dui vestibulum diam. Ut vitae ligula viverra urna porttitor convallis non suscipit augue.</p>
    </div>
    <div id="footer">
        Designed bfy <a href="http://stackoverflow.com/users/952248/mark-kramer">Mark Kramer</a>
    </div>
</body></html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers