Question

Ran into a problem on my web page where the footer in the master page wasn’t displaying correctly for one particular page. On that page, I had a

<div style="clear:both" /> at the bottom.

After banging my head at it for a while, I saw that all I needed to change to get the footer to show up properly was to change that line to:

<div style="clear:both"></div>

I don’t understand why writing it this way should produce a different result. Aren’t they semantically equivalent? I checked and double-checked that this was the only change I made. Flipping back and forth between the two would change the behavior of the footer.

So my question is… are those not equivalent? What’s the difference between them?

Edit: The odd part is, they both do what I want to the stuff above them in the page. I mean, in the self-closing div tag’s case, if I remove it entirely the page definitely reacts, so it must be doing SOMETHING with it and not just ignoring it completely.

Answer 1

<div /> is not a valid markup. A self-closing tag is not permitted.

You need to use the full version <div></div>.

A self closing div tag would make no sense, since it will result in an empty div. An empty div is usually not rendered by most of the browsers.