CODEWITHSUNDEEP
htmlcss
Rocky Singh
Rocky Singh

Reputation: 15430

Can I use div as a direct child of UL?

I'm having this code:

<ul>
   <div>
   </div>
</ul>

I feel no issue in my browser rendering it. I have read this too somewhere that li should only be used as direct child of ul.

Is this correct? Can't I use div as a direct child of UL? Is there any documentation for the above confusion?

Edit: This link says I can http://css-tricks.com/forums/discussion/11593/divs-inside-uls/p1

Upvotes: 60

Views: 83366

Answers (6)

jitendra varshney
jitendra varshney

Reputation: 3562

you can use div tag under like this ul-> li -> div because you can only use li tag after the ul tag ,your code will be run fine but there would be validation error

so you can use like this

 <ul>
     <li>
         <div></div>
     </li>
 </ul>

Upvotes: 5

RaBz
RaBz

Reputation: 145

No the div cannot be nested inside the element, only < li> can be used as child element. instead of wrapping div inside ul element. you can do something like this 

<ul class="class1">
 <li class="child1">
   <ul>
     <li>item1</li>
     <li>item2</li>
     <li>item3</li>
   </ul>
 </li>
<ul>

Upvotes: 6

Ahsan Khurshid
Ahsan Khurshid

Reputation: 9469

The HTML unordered list element <ul> represents an unordered list of items, namely a collection of items that do not have a numerical ordering, and their order in the list is meaningless. Typically, unordered-list items are displayed with a bullet, which can be of several forms, like a dot, a circle or a squared. The bullet style is not defined in the HTML description of the page, but in its associated CSS, using the list-style-type property.

Permitted content: 

zero or more <li> elements

Upvotes: 1

Shikiryu
Shikiryu

Reputation: 10219

For HTML 5 :

http://www.w3.org/TR/html-markup/ul.html

Permitted contents

Zero or more li elements

For HTML 4 :

http://www.w3.org/TR/html401/struct/lists.html#h-10.2

<!ELEMENT UL - - (LI)+

EDIT :

I forget the other HTML5 :D (which have the same specification on this than the W3C's one)

http://www.whatwg.org/specs/web-apps/current-work/multipage/grouping-content.html#the-ul-element

Upvotes: 8

Andy
Andy

Reputation: 14575

No. If you want valid markup a div should never be inside a , sorry. Some modern browsers will "autoclose" the ul tag before you open the div so watch out for that

Upvotes: 3

Quentin
Quentin

Reputation: 943615

No. The only element that may be a child of <ul> is <li>.

HTML 4:

<!ELEMENT UL - - (LI)+                 -- unordered list -->

(See also how to read a content model definition in a DTD)

HTML 5:

Content model: Zero or more li elements.

Upvotes: 56

Related Questions