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

Default Height value for empty <span> & <div> tags

P: 6
Hi,

I would like to ask about the default value of Height for an empty <span> or <div> tag.

from this code:

CSS:
Expand|Select|Wrap|Line Numbers
  1. div.baselineRule{ background: url(SHipuha.jpg) repeat-x scroll left bottom transparent; display:inline-block; }
  2.  
HTML:
Expand|Select|Wrap|Line Numbers
  1. <div class="baselineRule" style="width:70px"></div>
  2.  

for the code above,I understand that the image wont be displayed if I don't add:
1. a height value for the CSS. like height="1px"
2. add a content on the div. <div>aaaaa</div>

Is the default height for <DIV> and <SPAN> really 0px?

I just want a clear explanation, about why you should set either of the solutions above for this to work.

Is there a W3C rule or something that would explain why this is happening? Could you please provide me a link?

Any help is greatly appreciated.

Thanks!
Nov 23 '11 #1

✓ answered by drhowarddrfine

Div and span elements are for structure and not presentation. They don't have any height or width by default for that reason and will collapse to zero with no content unless you set the height or width.

Share this Question
Share on Google+
3 Replies


drhowarddrfine
Expert 5K+
P: 7,435
Div and span elements are for structure and not presentation. They don't have any height or width by default for that reason and will collapse to zero with no content unless you set the height or width.
Nov 23 '11 #2

P: 6
Thank you so much for the provided link and explanation Mr. drhowarddrfine. I really appreciate it :)
Nov 23 '11 #3

P: 1
The answer is not correct. The empty div can have height and width if you set. If not set, the width would be the width of its parent, and the height would be zero. For details, you can refer to https://myprogrammingnotes.com/defau...y-div-css.html
Oct 23 '18 #4

Post your reply

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