Home/ Questions/Q 6581761
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-25T16:11:39+00:00

Something interesting is happening with my HTML code and I was hoping someone could

  • 0

Something interesting is happening with my HTML code and I was hoping someone could explain what is going on here.

I have a very simple website with a container div, header div, and body div and it looks like the html elements aren’t responding at all to the divs(They aren’t going in the div they are between in the html markup).

Was wondering why its behaving this way.

Here is the html:

<html>
<head>
<title>Andy</title>

<link rel="stylesheet" href="style-andy.css" type="text/css" media="screen" />

</head>

<body>

<div id='container'>

  <div id='header'>
    <h1>Andy </h1>
  </div>
  <div id='image'>
    <img src='main.jpg' />
  </div>
</div>


</body>
</html>

Here is the CSS:

html, body
{
  margin:0;
  padding:0;
}

#container
{
  width:1024;
  margin:0 auto;
}

#header
{
  width:1024;
  padding-bottom:10px;
  border:1px solid black;
}
#header h1
{
  float: right;
  display: inline;
  color: black;
  font-family: helvetica, arial;
  font-weight: 100;
}
#image
{
  width:1024;
  height:100;
  border:1px dotted yellow;
}
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Your HTML looks fine, but your CSS is missing the px measurement on your widths and heights and your h1 tag is being made to float: right; meaning that the header div probably won’t have a height (You will need to ‘clear’ the header div)

    Edit:

    FYI, a simple way to clear is to just put a div with a class of clear under the content you need to clear, then use the CSS to tell that div to clear, for example:

    HTML:

    <div id="header">
    <h1>Andy</h1>
    <div class="clear"></div>
</div>

    CSS:

    .clear {
    clear: both;
}

    There are other ways of doing this, for example: http://www.webtoolkit.info/css-clearfix.html

    • 0