preventing line breaks of <div> tag

Discussion in 'HTML' started by luke, Sep 2, 2005.

  1. luke

    luke Guest

    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
    luke, Sep 2, 2005
    #1
    1. Advertising

  2. luke

    Manchild Guest

    luke wrote:
    > 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
    Manchild, Sep 2, 2005
    #2
    1. Advertising

  3. luke

    Spartanicus Guest

    "luke" <(dot)c.c> wrote:

    >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.

    --
    Spartanicus
    Spartanicus, Sep 2, 2005
    #3
  4. luke

    Guest

    luke (dot) wrote:

    > I'm using <div> tags,


    <div> elements

    <div> is a tag. </div> is a tag. <div>...</div> is an element.

    > <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.
    , Sep 2, 2005
    #4
  5. luke

    Neredbojias Guest

    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.

    --
    Neredbojias
    Contrary to popular belief, it is believable.
    Neredbojias, Sep 2, 2005
    #5
  6. luke

    luke Guest

    Many thanks to all who replied, I've learnt a lot from your clear and
    reasoned posts :).
    luke, Sep 3, 2005
    #6
  7. luke

    natR

    Joined:
    Sep 16, 2012
    Messages:
    1
    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.
    natR, Sep 16, 2012
    #7
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. shruds
    Replies:
    1
    Views:
    757
    John C. Bollinger
    Jan 27, 2006
  2. bernadou

    Force multi line field value to output with line breaks?

    bernadou, Jan 22, 2006, in forum: ASP .Net Web Controls
    Replies:
    2
    Views:
    345
    bernadou
    Jan 23, 2006
  3. M Wells
    Replies:
    0
    Views:
    131
    M Wells
    Oct 6, 2004
  4. Marek Stepanek
    Replies:
    12
    Views:
    402
    Peter J. Holzer
    Sep 2, 2006
  5. visu
    Replies:
    4
    Views:
    279
Loading...

Share This Page