Using bullet points in Firefox

Options
Kendra Mara
Kendra Mara
Ancient Membership First Reply
in Blackbaud Luminate Online® & Blackbaud TeamRaiser® Discussions

Good Evening,

Has anyone had experience using bullet points on a page? We have a memorial page that is updated almost daily as constiuents make Memorial donations. I have bulleted each memorial post and added an extra space between each line by adding an extra <br> to the HTML.

It looks perfect in IE, but when I view the page in Firefox, each line of text is pushed below the bullet point as opposed to next to it (I have also tested this without the extra line break).

For a visual of the issue, please view our Memorial Page.

Any help would be greatly appreciated!

Tagged:

Comments

  • mark.ajws
    mark.ajws
    Ancient Membership Facilitator 1

    The problem is less about Firefox and more about the HTML used on the page. If you remove the div tag after the list item (li) your problem will disappear. I believe the problem is because Firefox recognizes all divs as block-level elements. However, there is still the fact that each line of text is encapsulated in about 7 extra layers of spans. Take a closer look at your HTML and consider spacing and styling your list items with a single block of CSS or a linked stylesheet.

    Here is a great article about styling lists: http://www.alistapart.com/articles/taminglists/

  • Adrian Cotter
    Adrian Cotter
    Ancient Membership Facilitator 2

    The easiest way to do a list and have spaces in between items, is as so:

    There was a lot of other styling in there in spans which was pretty inconsistent (setting and resetting font attributes), which I think you'd want to do in your main stylesheet (adding an id to the UL tag you could do something like.

Categories