Menu
The main difference between div id and div class is that div id involves assigning an id attribute to a specific div element to apply styling or interactivity to that element while div class involves assigning the class attribute to several div elements to apply styling or interactivity to a set of div elements.
The <div> tag defines a division or a section in an HTML document. The <div> tag is used as a container for HTML elements - which is then styled with CSS or manipulated with JavaScript. The <div> tag is easily styled by using the class or id attribute. Any sort of content can be put inside the <div> tag!
DIV is a generic block level container that can contain any other block or inline elements, including other DIV elements, whereas P is to wrap paragraphs (text).
<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.
According to the HTML 4.01 spec, section 7.5.4 ("Grouping elements: the DIV and SPAN elements):
Start tag: required, End tag: required
So a self-closing <div> tag (like the first example you specified: <div />) is not valid.
If I remember right - <div /> is invalid. Use <div></div> if you want it to work everywhere. The closing tag is required, so doing things like <div class="Clear" /> won't work.
All grouping elements will behave the same way. You'll see the same behavior with both DIV and SPAN.
EDIT: Found this link while looking at the link in the answer posted by @Donut - its a matrix that shows which elements have an optional closing tag requirement (among other things.) Looked interesting, so I thought I'd post it here to share with everyone else as well.
It depends on the DOCTYPE that you're using.
For XHTML, which is XML, the two tags are equivalent. You would signal this to the browser by including one of the following DOCTYPEs as the first line in your page:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
For HTML 4.01, which is what all (?) browsers assume when there's no DOCTYPE, certain tags must be expressed as open-close. Most of the block-level tags require this, including such non-markup tags as <SCRIPT>. If you look at the WDG HTML documentation, you'll see whether a particular tag requires open-close or can be expressed as an empty tag, via the "syntax" item:
Syntax <DIV>...</DIV>
self terminating tags are valid in XML, but not in this case for HTML
The first option is not valid html; the second is. <div /> really confuses IE, so always go for <div><div/>.
You would not be able to put content in a "<div />".
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With