By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,466 Members | 1,132 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,466 IT Pros & Developers. It's quick & easy.

is li element block level elements naturally?

P: 64
hi

i'm learning css from w3schools . i look through all examples ,
i check below code that belongs to http://www.w3schools.com/css/tryit.a...ss_sprites_nav page unfortunatly i cant understand what is display:block; declation for #navlist li selector for , would you please describe me what's cause of use that, i remove that from css then check this html file in my browser in firefox 4 and IE 6 all thing are okay,

Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html>
  3. <head>
  4. <style type="text/css">
  5. #navlist{position:relative;}
  6. #navlist li{margin:0;padding:0;list-style:none;position:absolute;top:0;}
  7. #navlist li, #navlist a{height:44px;display:block;}
  8.  
  9. #home{left:0px;width:46px;}
  10. #home{background:url('img_navsprites.gif') 0 0;}
  11.  
  12. #prev{left:63px;width:43px;}
  13. #prev{background:url('img_navsprites.gif') -47px 0;}
  14.  
  15. #next{left:129px;width:43px;}
  16. #next{background:url('img_navsprites.gif') -91px 0;}
  17. </style>
  18. </head>
  19.  
  20. <body>
  21. <ul id="navlist">
  22.   <li id="home"><a href="default.asp"></a></li>
  23.   <li id="prev"><a href="css_intro.asp"></a></li>
  24.   <li id="next"><a href="css_syntax.asp"></a></li>
  25. </ul>
  26. </body>
  27. </html>
  28.  
and the other my question is , are'nt li element block level element naturally ?
thanks alot for your help.
Jun 21 '11 #1
Share this Question
Share on Google+
6 Replies


Dormilich
Expert Mod 5K+
P: 8,639
it’s probably there because of the #navlist a is not a block element by default and the writer was too lazy.
Jun 21 '11 #2

P: 8
don't use w3schools http://w3fools.com :)
Jun 21 '11 #3

P: 64
Dormilich dear,
you think there is'nt any reasonable reason for use that? and the other my question is :
li element is a block level element naturally, is'nt that ?

thanks alot.
Jul 1 '11 #4

P: 8
Yes li is block element -> http://www.webdesignfromscratch.com/...ck-and-inline/
Jul 1 '11 #5

P: 1
When you are in doubt whether an element is block level or inline just use them and if in browser they appear side by side then they are inline, if they appear one after another vertically , then they are block level.

Thanks
Bikram Choudhury
http://tutorial.webdesignershouse.com
Nov 27 '13 #6

Dormilich
Expert Mod 5K+
P: 8,639
When you are in doubt whether an element is block level or inline just use them ...
... or look it up in the DTD. block elements are listed with the %block; entity, inline elements with the %inline; entity.
Nov 27 '13 #7

Post your reply

Sign in to post your reply or Sign up for a free account.