hello coders,
nowa days i see everybody is using DIV and SPAN in there webpage .i have a little idea about this but i wanna know everything about this.can you tell me where can i get complete information about DIV and SPAN.you can also use this forum to clear my doubt.i wanna know everything about DIV and SPAN.
i also see that people are using

<tr>
		<th class="thLeft" width="150" height="26" nowrap="nowrap">something</th>
		<th class="thRight" nowrap="nowrap">something</th>
	</tr>

what is this <th> </th> tags for?
please satisfy my hunger for knowledge.
thank you.

Recommended Answers

All 7 Replies

DIV is "division", and is a block-level container object. It's used to divide a page into discrete, high-level "sections". For example, if you had a navigational section and content section, each would go into its own "div".

SPAN is an inline container object. It is used to set off elements that appear "within" content. It is mainly used to replace the formatting tags such as <b>, <i>, <em>, and <strong>. Since those are presentational tags, they have been superceded by CSS.

The <th> is "Table Header", and is meant for just that... to specify the column headers of a table.

Complete information on all things HTML, XHTML, etc:

http://www.w3.org/TR/REC-html40/struct/global.html

Member Avatar for diafol

DIV and SPANS are fine when required, but don't overdo them. Divitis and Spanitis are currently polluting websites.

Most HTML tags apply meaning (p makes a paragraph, h1 makes a heading etc.), the span and div tags apply no meaning at all, which might sound about as useful as a foam hammer, but they are actually used quite extensively in conjunction with CSS.

what you are asking is for us to basically explain the whole way that tables, divs and spans work?? think that you can read up on it with the web standards etc on:
http://www.w3schools.com/

see... problem solved

Firstly the HTML div element represents a division, as HTML is just structure
you can think of div as defining a logical division of the structure.

The div element is block level, meaning that it can only be contained by block level elements and not by inline level elements, though note the p (paragraph) element cannot
contain any block level elements; only inline.

Then we have the HTML span element, which represents an inline division, it spans around it's given content. As mentioned the span is inline level, not block. What this means is that it can be contained by both block and inline level elements, and that it can contain other inline elements, but not block level elements.

Meaning that this would be valid:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">

<html>
  <head>
    <title>My day at the park</title>
  </head>

  <body>
    <p>
      It was a jolly <span>good <em>day</em></span>.
    </p>
  </body>
</html>

because the em (emphasis) element is inline, but this would not:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">

<html>
  <head>
    <title>How often do you go to the park?</title>
  </head>

  <body>
    <span>
      <form action="park.php" method="post">
        <!-- ... -->
      </form>
    </span>
  </body>
</html>

because as explained span is inline and thus can only contain fellow inline elements, as and form is block level this is invalid.

However there is a problem with div and span, they bare hardly any semantics on a document, meaning that if you just have an HTML document with no styling nor behaviour chances are you won't need them, they are mainly used for specific styling, e.g.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">

<html>
  <head>
    <title>I can make specific letters blue!</title>
  </head>

  <body>
    <p>
      <span>c</span>raiggles.
    </p>
  </body>
</html>

because now I can select that span and specifically make it blue with CSS, like:

span {
  color: #00F;
}

the same problem bares with div, it is used for divising the page and thus you can then style or manipulate elements as a whole making markup bloated with divs.

this issue also leads on to people thinking you have to use div and span to style your document, which is of course incorrect, thus they may create unnescesary markup such as:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">

<html>
  <head>
    <title>I write silly markup!</title>
  </head>

  <body>
    <div>
      <p>this paragraph contains red text!</p>
    </div>
  </body>
</html>

and styling such as:

div {
  color: #F00;
}

whereas the div could just be removed and the p (paragraph) styled such as:

p {
  color: #F00;
}

I hope that clears up your understanding a little, if you have any questions feel free to post here or send me a personal message.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.