Forum Moderators: not2easy

Message Too Old, No Replies

Text directly in divs.

         

fischermx

6:57 pm on Apr 13, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hi,

Sorry, for the newbie question, but it is a common practice or recommended to use this :

<div>
My Text Here!
</div>

Instead of :
<div>
<p> My Text Here! </p>
</div>

The question really is, if it is valid to display text directly in a div (I see it in the browser), but I wonder about other repercussion, like for example, being seen for a search engine?

Robin_reala

8:37 pm on Apr 13, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Yes, it's valid. It's a question of semantics though. If you have a paragraph of text then the obvious element to use to mark it up is <p>. If the text isn't a paragraph then maybe there's a more suitable element? If the text is lacking in all semantics (probably unlikely) then the element most suitable will be <div> (or <span>).

Remember that <p> for styling purposes behaves exactly like <div> - it's a standard block level element.

fischermx

8:48 pm on Apr 13, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Ok, thanks, the problem I see with the <p> is the annoying extra linebreaks. That's what I was thinking of place text directly on the div.
For example :
<div>
Usefull information in next block:
<div class="block">
</div>
</div>

Using <p>, would cause a space between the title and the box drawn by the div.

[edited by: fischermx at 8:51 pm (utc) on April 13, 2005]

bruhaha

8:50 pm on Apr 13, 2005 (gmt 0)

10+ Year Member



Remember that <p> for styling purposes behaves exactly like <div> - it's a standard block level element.

Yes, it is a "standard block element", but "behaves exactly like" may be a bit misleading. Browsers do not treat them precisely the same --unless told to do otherwise, they add a top margin before the <p>, a bottom margin after the block.

fishermx,
if the default margins are your reason for using<div> instead of <p> remember that you can define a style for <p> that removes the margin (it isn't actually an "extra linebreak"). Alternately, you can create a class for any paragraphs you wish to style differently from the rest, and adjust the margins for that class however you wish.

fischermx

8:55 pm on Apr 13, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member




Do these default margins have anything to do with why you wish to use <div> instead of <p> in some cases?

Yes, that's the only reason, to avoid the space below the paragraph.
Could you give an example?

fischermx

8:58 pm on Apr 13, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



geez, I can't believe is so simple :

p
{
margin:0;
}

Thank you!

Robin_reala

9:13 pm on Apr 13, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



bruhaha - sorry, should have made it clear that I was talking about additional styles, not default styles. silly of me.