What is the best way to push page down 30px
, and put a div
tag height 30px
at top, like a toolbar?
I tried code as below, but it could not push down page that content div with position:absolute;
and top:0;
, or div
with position:fixed;
, z-index:9999;
top:0;
var divToolbar = document.createElement("div");
divToolbar.id = "divToolbar";
divToolbar.style.width = 100 + "%";
divToolbar.style.height = 30 + "px";
document.body.insertBefore(divToolbar,document.body.firstChild);
If the content div has position:absolute;
it's layout will not be affected by other elements.
You would need to add top: 30px
to the content div.
Use the css below for your content div:
.content {
position:absolute;
top:30px;
}
As the commenter to your post suggested, this seems to be the best option.
.header{
position:fixed;
height:30px;
}
.content{
margin-top:35px;/* or adjust it the way you want */
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.