when creating my html and css based page, i was facing issues related to the footer header which was not shown at bottom. footer division had border box shown at center. please help me to correct it. Also, please suggest how to edit each of the background of each division such that every division have some image on it and while sliding, the image background doesn't move.
here is my css code:
#header{
box-sizing:border-box; /* allows to include padding and borders in an element total width and height*/
height:100px;
border: solid 2px blue;
border-radius:5px;
padding:30px;
width:100%;
text-align:center;
font-style: italic;
font-family:Arial, Helvetica, sans-serif;
color:red;
}
#navigation{
box-sizing:border-box;
border: 2px solid red;
height:50px;
width:100%;
padding:15px;
text-align:center;
color:green;
font-size:larger;
font-family:Verdana, Geneva, Tahoma, sans-serif;
border-radius:10px;
}
#left_body{
float:left;
border: 2px solid green;
box-sizing:border-box;
text-align:center;
padding:20px;
padding-top:220px;
border-radius:15px;
height:500px;
width:20%;
font-style: italic;
font-family:monospace;
color:yellow;
}
#Main_Content{
border: 2px solid orange;
float:left;
box-sizing:border-box;
padding:20px;
height:500px;
width:60%;
font-style:italic;
font-family:monospace;
color:blue;
border-radius:15px;
text-align: center;
padding-top:220px;
}
#right_body{
border: 2px solid blue;
float:left;
padding:20px;
width:20%;
color:chocolate;
padding-top:220px;
height:500px;
border-radius:15px;
text-align:center;
box-sizing: border-box;
}
#footer{
border:2px solid violet;
box-sizing: border-box;
float:none;
text-align:center;
padding:20px;
width:100%;
height:100px;
color:black;
border-radius:12px;
}
<body>
<h1 id="header">Header</h1>
<h1 id="navigation">Navigation Menu</h1>
<h1 id="left_body">Content</h1>
<h1 id="Main_Content">Main Content</h1>
<h1 id="right_body">Content</h1>
<br/>
<h1 id="footer">footer</h1>
</body>
question from:
https://stackoverflow.com/questions/65937489/why-my-css-footer-division-has-problem-with-border-editing-i-am-uploading-my-co 与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
