Problem with DIVs

**NateL** · Jan 21, 2009 13:07

I'm having a strange problem that is throwing me off.

Here is my basic layout:

HTML Code:

<body>
<div id="header"> header </div>
<!-- end div:header-->
<div id="main">
  <div class="content">
    <div id="leftCol"> leftCol </div><!--end div:leftCol-->
    <div id="rightCol"> rightCol </div> <!--end div:rightCol-->
    <div class="clear" /><!-- end div:clear-->
  </div> <!--end div:content-->
</div><!-- end div:main-->
<div id="footer"> footer </div><!-- end div:footer-->
</body>

When things were not working well with my CSS, I decided to see what was going on inside FireBug...and something is completely screwed up. My above code renders out with the Footer INSIDE the "main" div!

HTML Code:

<div id="footer"> footer </div><!-- end div:footer-->
</div><!-- end div:main-->
</body>

I even went as far as removing ALL CSS, and that does not help at all. FireBug still renders the footer inside the main div.

**NateL** · Jan 21, 2009 13:12

Yah Firebug doesn't work too well for HTML apparently

I changed my Doctype to STRICT and closed my clear div:

<div class="clear" />

to

<div class="clear"></div>

and it's working now

**fredda** · Jan 21, 2009 13:21

For that you use an HTML validator

.

**AutisticCuckoo** · Jan 21, 2009 13:35

The NET (null end-tag) syntax is different in HTML than it is in X(HT)ML, and it's not supported by browsers anyway. (<div/> in HTML means <div>>, i.e., a <div> start tag followed by a greater-than sign.)

That means your 'clear' div is closed by the </div> tag you intended to close the 'content' div; the 'content div is closed by the end tag you intended for the 'main' div, and the 'main' div is never closed.

The <div/> syntax works in XHTML, but only if served as an application of XML. If served as text/html it is HTML and is parsed as HTML by the HTML parser.

User Tag List

Thread: Problem with DIVs

Thread Tools

Display

Problem with DIVs

Bookmarks

Bookmarks

Posting Permissions