#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2009
    Posts
    66
    Rep Power
    10

    Hr tag renders poorly in Firefox


    Hello,

    I am trying to use the hr tag to create a visual division between news stories on this web page http://www.heshimakenya.org/newsmedia.html

    When I view this page in Firefox on a Mac, the story headlines are immediately under the hr line. I want to add some bottom padding to this line so there is some white space between the line and the headlines.

    I have used the hr tag in other sites and have never had this rendering issue before so I'm really stuck. For example, the site below uses the hr tag but when viewed in Firefox on a Mac, the lines render fine.

    http://oharenoise.org/
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Dec 2003
    Posts
    721
    Rep Power
    446
    In your stylesheet you have:

    Code:
    * {padding: 0; margin: 0}
    That's overwriting the natural margins that the <hr> would have, so you have to put them back:

    Code:
    hr {margin: .5em auto}
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2009
    Posts
    66
    Rep Power
    10
    Thank you very much!

IMN logo majestic logo threadwatch logo seochat tools logo