Div go out of viewport (like the StackOverflow bar at the top)
You've probably seen the toolbar from StackOverflow (at the top of this page), how it hangs outside the viewport. Both of the edges hang off the page and so does the top. I have tried this so many times but can't find an answer. How would I make a div behave like this- in html, css, or javascript- can someone help me? (Po开发者_JAVA技巧sition:fixed; is not what I'm looking for.)
it is just a div, but you have to turn off the paddings in the body that is around:
<body>
<div class="bar">test</div>
</body>
body{
margin:0;
padding:0;
}
.bar {
padding:3px;
background-color:#ff7200;
}
a div automatically has a width of 100%
a live sample here
If you're talking about the grey bar at the top of the page then it's simply a div styled with a grey background and a negative bottom margin:
#custom-header {
background-color: #EEEEEE;
height: 31px;
margin-bottom: -31px;
}
加载中,请稍侯......
精彩评论