I'm trying to make a DIV tag appear like a page onto of a page. The DIV tag has a solid-color background and it's on top of the HTML BODY graphical background. To complete the effect, I want margins on all 4 sides of the DIV tag. Unfortunately, the bottom margin bleeds onto the bottom of the screen. The border isn't even visible. I validated the CSS code, but it still won't work. Any ideas? Thanks!
div.page {
position: absolute;
left: 50%;
margin-top: 40px;
margin-left: -350px;
margin-bottom: 40px;
background-color: #cc9966;
border: solid #663333 2px;
padding: 10px 10px 10px 10px;
width: 700px;
}Try adding a height factor.
div.page {
position: absolute;
left : 50%;
margin-top : 40px;
margin-left: -350px;
margin-bottom: 40px;
background-color: #cc9966;
border : solid #663333 2px;
padding: 10px 10px 10px 10px;
width : 700px;
height : 300px;
}Thanks for the suggestion. Unfortunately, it didn't work.
It looks like you're trying to centre it vertically, I'm afraid that you can't do that. You can however add margins to the body tag:body{
margin:30px 0;
padding:0;
}
div.page {
position: absolute;
left: 50%;
margin-top: 40px;
margin-left: -350px;
margin-bottom: 40px;
background-color: #cc9966;
border: solid #663333 2px;
padding: 10px 10px 10px 10px;
width: 700px;
}Try adding a height factor.
div.page {
position: absolute;
left : 50%;
margin-top : 40px;
margin-left: -350px;
margin-bottom: 40px;
background-color: #cc9966;
border : solid #663333 2px;
padding: 10px 10px 10px 10px;
width : 700px;
height : 300px;
}Thanks for the suggestion. Unfortunately, it didn't work.
It looks like you're trying to centre it vertically, I'm afraid that you can't do that. You can however add margins to the body tag:body{margin:30px 0;
padding:0;
}