C# Tutorials and offshore development in India
    Tutorials   Resources   Forum   Communities   Interview   Jobs   Projects   Offshore Development    
Silverlight Tutorials | Mentor | Code Converter | Articles | Code Factory | Computer Jokes | Members | Peer Appraisal | IT Companies | Bookmarks | Revenue Sharing |


Prizes & Awards
My Profile



Active Members
TodayLast 7 Days more...

New Feature: Community Sites: Create your own .NET community website and start earning from Google AdSense ! It's Free !




Span versus Div Tag in HTML


Posted Date: 30 Oct 2006    Resource Type: Articles    Category: General

Posted By: HimaBindu Veeramachaneni       Member Level: Diamond
Rating:     Points: 10



This article illustrates the differences between Span and Div tags.

span vs div



First of all div is a block element .It blocks the entire section of a page. So anything following it has to go to the next line. While, Span is an inline element. Inline elements are printed in the same line.

Example




<html>
<head>
<P>divtag vs span</p>
Span
<span> <b>Hello how are you doing</b></span>
</head>
<body>
<p>divtag vs span</p>
Div
<b><div> Hello how are you doing</div> </b>
</body>
</html>


Run this code sample by copying it in a word processor and saving it with a .html extension and then opening it in a browser of your choice. The same text for div is separated whereas that for span is printed on same line.

When to use Div and span:



It depends on the requirements. Div tag is used for alignment of the section of a page and for creating layers in Javascript. The div tag allows us to name certain sections of documents so that it can be affected with style sheets or DHTML. Span doesn’t do formatting on it’s own.

The primary attributes of the <div> tag are:

• style
• class
• id

Note: Div acts as a paragraph beginning/end, and while we can have paragraphs within a <div> we can't have a <div> inside a paragraph.




Responses

Author: Kishore Pai    01 Nov 2006Member Level: Bronze   Points : 0
The example given for that article shows the same output for span as well as div, the difference isnt clear. Can you specify more clearly?

Kishore


Author: Gaurav Arora    27 Jul 2008Member Level: Gold   Points : 1
Thanks for your detailed overview on Div/Span.
I have asked the same question in an Interview and I showed them same example as you explained here.
Thanks!


Feedbacks      
Popular Tags   What are tags ?   Search Tags  
When to Span or Div  .  Span vs Div tags  .  Div vs Span tags  .  Difference between Div and Span tags  .  Difference between Div and Span  .  Choosing Span over Div  .  Choosing Div over Span  .  

Post Feedback


This is a strictly moderated forum. Only approved messages will appear in the site. Please use 'Spell Check' in Google toolbar before you submit.
You must Sign In to post a response.
Next Resource: Bluetooth Made it Easy!
Previous Resource: Date Validation and Triming the spaces in Javascript
Return to Discussion Resource Index
Post New Resource
Category: General


Post resources and earn money!
 
Related Resources



dotNet Slackers   BizTalk Adaptors    Web Design

doors in nj

Contact Us    Privacy Policy    Terms Of Use