HTML/CSS Why is My HTML Footer Not Displaying Correctly?

  • Thread starter Thread starter camel-man
  • Start date Start date
  • Tags Tags
    Html
AI Thread Summary
The footer in the provided HTML and CSS code is not displaying correctly due to the use of "float: bottom" in the CSS for the footer element. "Bottom" is not a valid value for the float property, which only accepts "left," "right," or "none." To fix the footer issue, the float property should be removed or replaced with a valid value. Additionally, there is a typo in the CSS where "postion" should be corrected to "position." Ensuring these changes will help resolve the layout problems and improve the overall structure of the webpage.
camel-man
Messages
76
Reaction score
0
Not sure why my footer is not working correctly in my file, anyone see what is wrong?

Code:
<html>
<head>
<title> Layout with Divs </title>
<link href="divstyle.css" rel="stylesheet" type="text/css" /> 
</head>


<body>

<div id="outer">
<div id="bannerbox"> Banner </div>
<div id="hyperlink"> Hyperlink </div>
<div id="content"> Content </div>
<div id="footer"> Footer </div>
</div>

</body>
</html


*****~And this is my css~*****

body{
background-color: #424242;
margin-top: 0;
padding-bottom: 60px;

}

div{
border: 1px solid black;
}

#outer{ 
border: 1px dotted #ee0bbb;
width: 603px;
margin-left: 140px;
background-color: white;
height: 800px;
postion: relative;
}

#bannerbox{ 
width: 480px;
height: 70px;
margin-left: 53px;
margin-top: 5px;
} 

#hyperlink{
width: 150px;
height: 200px;
margin-top: 40px;
margin-left: 10px;
float: left;

}

#content{
width: 350px;
height: 400px;
margin-top: 40px;
margin-right: 10px;
float: right;
}

#footer {
width: 50px;
height: 40px;
margin-top: 40px;
margin-right: 10px;
float: bottom;
}
 
Technology news on Phys.org
What do you suggest I change it to? Should i change the data type ?
 
Thread 'Star maps using Blender'
Blender just recently dropped a new version, 4.5(with 5.0 on the horizon), and within it was a new feature for which I immediately thought of a use for. The new feature was a .csv importer for Geometry nodes. Geometry nodes are a method of modelling that uses a node tree to create 3D models which offers more flexibility than straight modeling does. The .csv importer node allows you to bring in a .csv file and use the data in it to control aspects of your model. So for example, if you...
I tried a web search "the loss of programming ", and found an article saying that all aspects of writing, developing, and testing software programs will one day all be handled through artificial intelligence. One must wonder then, who is responsible. WHO is responsible for any problems, bugs, deficiencies, or whatever malfunctions which the programs make their users endure? Things may work wrong however the "wrong" happens. AI needs to fix the problems for the users. Any way to...

Similar threads

Replies
7
Views
2K
Replies
10
Views
2K
Replies
1
Views
2K
Replies
5
Views
2K
Replies
5
Views
2K
Replies
2
Views
1K
Replies
8
Views
2K
Replies
14
Views
3K
Replies
9
Views
2K
Back
Top