div tag, no line breaking???

Discussion in 'CSS' started by dj_jamz102, May 17, 2008.

  1. #1
    Hi,

    I want to add a div tag to add a simple style within a sentence, and I
    want to do so without the line breaking the moment the div tag arrives
    on the scene. For instance, let's just say I had a <b></b> tag wrapped
    around the word "brown" in the middle of a sentence and wanted to
    replace it with <div style="font-weight: bold;">. When I do this, I get
    the unwanted carriage return. For example:

    Using <b></b>:
    The big BROWN car... (no line break)

    Using <div style="font-weight: bold;">:
    The big BROWN
    car... (annoying line break)

    What's the proper way to handle this? I just need to eliminate the
    carriage return caused by the div tag.

    Thank you in advance for any assistance. I'm hoping the formatting
    examples above appear correctly. Could not find a 'Search the Archives'
    option on this site, so I couldn't search for this answer, which has
    probably been answered before.

    Sincerely,
    dj_jamz102
     
    dj_jamz102, May 17, 2008 IP
  2. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #2
    Why would you want to do that? I can think of no sane reason. The <b> is at least a typographical convention if used for that purpose, for example, the first use of a person's name in an article. If it's meant for strong emphasis, the <strong> tag would be appropriate. Then if it's none of the above, use the correct structural tag for segregating inline content for special handling, the <span>.
    
    <p>
      I wore <span class="ijustliketomakethingsbold">brown</span>   
      pants today.
    </p>
    =========
    .ijustliketomakethingsbold {
      font-weight: bold;
      }
    Code (markup):
    The <div> element is for grouping or aggregating block level containers. It is purely structural, with no semantic value.

    cheers,

    gary
     
    kk5st, May 17, 2008 IP
  3. wd_2k6

    wd_2k6 Peon

    Messages:
    1,740
    Likes Received:
    54
    Best Answers:
    0
    Trophy Points:
    0
    #3
    The above is correct, just incase you are unfamilar with some of the terminology he is basically saying that a DIV is a block, and items will always go onto the next line after closing a div, unless the DIV is set to float to the left, or it is positoned absolutly.

    For styling like you want, without line-breaks you would use a SPAN instead of a DIV. They both basically do the same thing, you can give a SPAN an ID, CLASS or STYLE just as with a DIV. However spans are in-line, meaning you will not get the line break (unless you specify it to do so with display: block).

    Usually if it's a word or two, if it's a heading (h1,h2,h2) you would style that heading, if it's a word and has a lot of styling then go for the span, if it's just bold your adding go with <strong>.
    However if you want to style a whole block of content, then div is usually the way to go.
     
    wd_2k6, May 17, 2008 IP