SitePoint Sponsor

User Tag List

Results 1 to 12 of 12
  1. #1
    gimme the uuuuuuuuuuu duuudie's Avatar
    Join Date
    Feb 2004
    Location
    Switzerland
    Posts
    2,253
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    line breaks: <br /> or a CSS way?

    Hi

    how do you manage line breaks? Do you use the <br /> tags or do you use css for this task?


  2. #2
    He's No Good To Me Dead silver trophybronze trophy stymiee's Avatar
    Join Date
    Feb 2003
    Location
    Slave I
    Posts
    23,449
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    <br />

    That's why it's there

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,877
    Mentioned
    160 Post(s)
    Tagged
    4 Thread(s)
    Hi Alex,

    I try to avoid breaks at all cost as they render differently in browsers even when you attack padding, margins and height.

    In most cases there is no need for them anyway as you can control the margin on the element above and the margin on the element below to create the space you need without an extra tag.

    However some times where you are not worried about the spacing then the odd break isn't too bad (if you're feeling lazy) but most times you just don't need them anyway.

    The only time you will really need them is that sometimes mozilla will only clear elements when you use a break <br style="clear:both" /> (even using my clearer technique very occasionally fails).

    A lot of people make the mistake of constructing menus by using anchors and separating the lines with a break when they should be using a list or some other more semantic element.

    Well, thats my take on it anyway

    Paul

  4. #4
    gimme the uuuuuuuuuuu duuudie's Avatar
    Join Date
    Feb 2004
    Location
    Switzerland
    Posts
    2,253
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok thanks for the replies.

    I am working on displaying some content submited by users.
    Therefore, using a scripting solution instead of the <pre></pre> tags, I will replace each "\n" with a <br />.
    Is that the best solution regarding the project?

  5. #5
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,236
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    If you can, convert the text to paragraphs rather than one long string separated by <br />.

  6. #6
    gimme the uuuuuuuuuuu duuudie's Avatar
    Join Date
    Feb 2004
    Location
    Switzerland
    Posts
    2,253
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yep good advice vinnie.

    I will only use the <br /> for the people ruining the layouts using extra long lines (90chars no space... humm...)

    btw, how do you deal with long lines with no space?


  7. #7
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,236
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by duuudie

    btw, how do you deal with long lines with no space?
    Code:
    pre {
      overflow: scroll;
    }

  8. #8
    SitePoint Wizard megamanXplosion's Avatar
    Join Date
    Jan 2004
    Location
    Kentucky, USA
    Posts
    1,099
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I use both CSS and <br /> to make line breaks, depending on the situation I'm faced with. Sometimes I use several <br />'s and then use CSS to hide it so that non-CSS browsers still have easily readable content. When it comes to seperating things for everyone, I typically use only CSS and use paragraphs when I need to. For breaking long lines, simply parse the message and enter a space wherever you need to and the line will wrap by itself, no need for an explicit line break.

  9. #9
    SitePoint Enthusiast
    Join Date
    Oct 2004
    Location
    Brunei
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    <br /> still has some use, one example off the top of my head is form layout. <input> elements aren't block-level so if you want an element following an <input> to appear on the next line, <br /> is one way of doing it. Of course, you could use CSS but then if the browser doesn't support CSS (or has them turned off) your form could end up being one long-running line.
    Last edited by pocketsized; Nov 9, 2004 at 07:43.

  10. #10
    He's No Good To Me Dead silver trophybronze trophy stymiee's Avatar
    Join Date
    Feb 2003
    Location
    Slave I
    Posts
    23,449
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    If you use <p> approitaely your use of <br /> will be minimized but not eliminated. The example with forms above is an excellent one.

  11. #11
    gimme the uuuuuuuuuuu duuudie's Avatar
    Join Date
    Feb 2004
    Location
    Switzerland
    Posts
    2,253
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Very instructive replies.
    thanks to you all

  12. #12
    Beer Monster -Ox's Avatar
    Join Date
    Apr 2003
    Location
    sowth afreeka
    Posts
    374
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    also if you use <p> you can also give it a height and make the space that you are looking for the exact height you require, not sure if its the best way but its A way
    My postings are a natural product.
    The slight variations in spelling and grammar enhance its
    individual character and beauty and in no way are to be
    considered flaws or defects - http://www.guinnesspig.net


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •