Really quick question about XHTML.

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Really quick question about XHTML.

Post by JellyFish »

Is this illegal in XHTML?:

Code: Select all

<div/>
As long as it's an empty element right?
User avatar
Luke
The Ninja Space Mod
Posts: 6424
Joined: Fri Aug 05, 2005 1:53 pm
Location: Paradise, CA

Post by Luke »

There is a really easy way to tell...

http://validator.w3.org/check

(it's not valid that I know of)
matthijs
DevNet Master
Posts: 3360
Joined: Thu Oct 06, 2005 3:57 pm

Post by matthijs »

http://www.w3.org/TR/xhtml1/#C_2
Doesn't explicitly say anything about the div, but I assume it's invalid.

But it also wouldn't make any sense. Why would you need an empty div? A <hr />, <img /> or <br /> means and does something, a <div /> wouldn't.
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Post by JellyFish »

matthijs wrote:http://www.w3.org/TR/xhtml1/#C_2
Doesn't explicitly say anything about the div, but I assume it's invalid.

But it also wouldn't make any sense. Why would you need an empty div? A <hr />, <img /> or <br /> means and does something, a <div /> wouldn't.
A empty div for the purpose to have a class of either clearLeft, clearRight or clearBoth. I assume you know what these could mean.
matthijs
DevNet Master
Posts: 3360
Joined: Thu Oct 06, 2005 3:57 pm

Post by matthijs »

Ok, I get what you want. But I wouldn't consider that an elegant solution. There are other solutions to clear floats.

If you really are absolutely sure there is no other option then to insert a meaningless element just for the sake of clearing something, I would use a br or hr. Then use css to hide them (br class="hidden or hr class="hidden"). A hr would somehow make a little sense. When you would view the document unstyled, a hr displays as a kind of section separator.
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Post by JellyFish »

matthijs wrote:Ok, I get what you want. But I wouldn't consider that an elegant solution. There are other solutions to clear floats.

If you really are absolutely sure there is no other option then to insert a meaningless element just for the sake of clearing something, I would use a br or hr. Then use css to hide them (br class="hidden or hr class="hidden"). A hr would somehow make a little sense. When you would view the document unstyled, a hr displays as a kind of section separator.
I like the idea of hr, but I can't seem to get rid of the border or height in IE.

I just set border:none; and height:0px. And it left a gray horizontal line in IE.

Although br makes sense to, and it works. But I'd like to get rid of all the default behaviors that br has.
matthijs
DevNet Master
Posts: 3360
Joined: Thu Oct 06, 2005 3:57 pm

Post by matthijs »

And are you absolutely sure you can't use the existing elements? Or can you self-clear the elements you want to clear?
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Post by JellyFish »

matthijs wrote:And are you absolutely sure you can't use the existing elements? Or can you self-clear the elements you want to clear?
Your absolutely right. I can do such things.

Thank you so much for the epiphany! But I'll still use <br class="clear[Left,Right,Both]"/> if all else fails. :D

To keep the concepts clear, is there a good article you'd recommend me reading, about clears?
User avatar
Kieran Huggins
DevNet Master
Posts: 3635
Joined: Wed Dec 06, 2006 4:14 pm
Location: Toronto, Canada
Contact:

Post by Kieran Huggins »

ewe - class soup...

Stay semantic and strong, brother!
matthijs
DevNet Master
Posts: 3360
Joined: Thu Oct 06, 2005 3:57 pm

Post by matthijs »

This article sums it up very nicely:
Methods for Containing Floats

In most cases when I want a containing element to clear I float it as well. Say you'd have a layout with 3 horizontal boxes wrapped in a div, and below that again a wrapper div with a few boxes. You float the little boxes. Then to have the wrapper divs not collapse I float them as well and just give them a width of 100% (no margin or padding horizontally to prevent box-model problems).
Post Reply