preventing line breaks of <div> tag

[luke]

Hi -

Hope this is OK posting to alt.html, I couldn't find an alt.css. I'm using
<div> tags, and have noticed that with Firefox with Windows at least, a
<div></div> creates a new paragraph. I'd like to mark some text with a class
without it creating a new paragraph, so have been using <font
class='myclass'></font> instead, but it's really bugging me that I don't
know how to prevent a <div> tag from creating a paragraph break. Is there a
way?

Thanks
Luke

 

[Manchild]

Hi -

Hope this is OK posting to alt.html, I couldn't find an alt.css. I'm using
<div> tags, and have noticed that with Firefox with Windows at least, a
<div></div> creates a new paragraph. I'd like to mark some text with a class
without it creating a new paragraph, so have been using <font
class='myclass'></font> instead, but it's really bugging me that I don't
know how to prevent a <div> tag from creating a paragraph break. Is there a
way?

Thanks
Luke

You might try something like the following:

..foo {display: inline}

Sometext sometext sometext <div class="foo">some other text</div> blah
blah blah

James

 

[Spartanicus]

Hope this is OK posting to alt.html, I couldn't find an alt.css.

CSS is on topic here in alt.html

I'm using
<div> tags, and have noticed that with Firefox with Windows at least, a
<div></div> creates a new paragraph.

A div is non semantic, it says nothing about it's content. It is a block
level element, thus it creates a box around it's content.

I'd like to mark some text with a class
without it creating a new paragraph, so have been using <font
class='myclass'></font> instead

Div has an inline non semantic brother: the span element (<span
class="emphasis">foobar</span>). As with the div element it should only
be used as a last resort only if there is no better element available.
You've not told us what it is that you are trying to do so we can only
guess. My guess is that you want to emphasize some text, to do so the
<em> element would be the right choice.

 

[dingbat]

I'm using <div> tags,

<div> elements

<div></div> creates a new paragraph.

No, <p> creates a new paragraph. <div> creates a new block-level
element. With CSS you can make this _look_ however you like (but it's
still not a paragraph).

I'd like to mark some text with a class
without it creating a new paragraph,

So use either <div> or <span>, rather than <p>. Then apply some CSS,
either inline (with style="..." ) or through a class attribute and a
stylesheet.

<div> and <span> are similar, but different. They are both "anonymous"
in a way that <p> isn't - they have no default meaning, just whatever
you choose to give them as presentation (by CSS) or by implied meaning
through a class attribute.

Their difference is that <div> is a "block-level" element and that
<span> is an "inline" element. This implies three specific differences:

- <div> has block-level content (in the DTD), so can contain
block-level elements or inline elements. <span> has only inline
content, so can't contain block-level elements.
<div><span></span></div> is OK, <span><div></div></span> is not. This
is fixed in the DTD and can't be changed.

- <span> is an inline element, <div> is a block. So you can place
<span> inside elements that can only contain inline content, but you
can't place <div> there. <a><span></span></a> is OK, <a><div></div></a>
is not. This is fixed in the DTD and can't be changed.

- The default CSS behaviour for <div> is display:block and for <span>
it is display:inline; You can always change this, but whenever you do
that in CSS, think first as to whether it's a hint that you're actually
using the wrong element.

So choose <div> or <span> on the basis of the nesting rules. Then
adjust the CSS to fit that and your desired appearance. Sometimes (but
rarely) you will make a <div> look like a <span> with CSS, or vv.

If it really is a paragraph, then use <p>. You can use CSS and class to
make this behave just like a <div>, except that its default meaning
will always imply some level of "paragraph" (and it's quite reasonable
to render paragraphs as in-line text, if you're making summaries etc.)


Recommendations:

- Never ever use <font> ever again.

- Look at the nesting rules for what's going inside your current <div>.
If you can, use a <span> instead. If you can't (unlikely), then use
CSS display:inline; on your existing <div>.

- Read the HTML spec from the W3C site. Read the DTD and learn to
understand what it tells you about nesting. Ignore any HTML "tutorial"
sites that aren't the W3C, because that one's the real gospel and the
others are usually wrong (this does require a certain level of
knowledge on your part).

- Learn to use HTML validation.

 

[Neredbojias]

With neither quill nor qualm, luke quothed:

Hi -

Hope this is OK posting to alt.html, I couldn't find an alt.css. I'm using
<div> tags, and have noticed that with Firefox with Windows at least, a
<div></div> creates a new paragraph. I'd like to mark some text with a class
without it creating a new paragraph, so have been using <font
class='myclass'></font> instead, but it's really bugging me that I don't
know how to prevent a <div> tag from creating a paragraph break. Is there a
way?

"div" stands for (d)iscrete (I)ndividual (v)olume so it don't like to
have nothing next to it. You can, however, use position:absolute,
position:relative, or float:left|right to force the issue.

 

[luke]

Many thanks to all who replied, I've learnt a lot from your clear and
reasoned posts .

 

[natR]

I learned more from dingbat's response than the W3C page on DIV.

The W3C page mentions that DIVs are surrounded by line breaks, which can be altered, but did not lead me toward SPAN. A web search on how to form off line breaks turned up this thread. Dingbat's response helped me understand DIVs for the first time and realize I want SPAN.