WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Firefox CSS trouble (5 posts)

  1. lhk
    Member
    Posted 8 years ago #

    Hi,

    I'm trying to style a table and have some trouble with how this displays in IE and FF. The relevant style code is:

    #ptable, th, td {
    font: 10px Verdana, Arial, sans-serif;
    border-collapse: collapse;
    border: 1px solid #000;
    }

    Goal is displaying a 1px border in black for table cells and table. This works just nicely in IE, however in FF some of the "lines" get obliterated, not even completely, sometimes this happens in mid-line, as if erased.

    Refresh does nothing. Curiously, if I call up the CSS editor however, the lines display normally again. I can't seem to control this behaviour.

    Now, I wonder whether this is a known problem with such a display in FF, whether my browser may be buggy or ... whatever this may be? I never noticed such behaviour before anyway.

  2. lhk
    Member
    Posted 8 years ago #

    Hi again,

    ok, this seems to be a Firefox-Bug with border-collapse.

    Anyone have an idea how I can CSS-style the border-width of a table to (an exact) 1px without using border-collapse?

  3. lhk
    Member
    Posted 8 years ago #

    Hi,

    the solution (works in IE and in FF at least):

    #ptable {
    border-top: 1px solid #000000;
    border-right: 1px none #000000;
    border-bottom: 1px none #000000;
    border-left: 1px solid #000000;
    }

    #ptable td {
    border-top: 1px none #000000;
    border-right: 1px solid #000000;
    border-bottom: 1px solid #000000;
    border-left: 1px none #000000;
    font: 10px Verdana, Arial, sans-serif;
    }

    "ptable" is by the way the ID of the table.

  4. LiverpoolLad
    Member
    Posted 8 years ago #

    I wonder was it the shortened version of the colour that caused it?

    Either way, good to know as I still use tables for what they are.

  5. lhk
    Member
    Posted 8 years ago #

    Hi LiverpoolLad,

    yes, that table is used for displaying pedigree data, and it just looks horrid to have a fine 1px border around the image displaying the animal and the thickish "normal" border of an unstyled table below that.

    And nope - as far as I was able to find out it's not the shortened color, it's a problem in how IE and FF treat the "border-collapse: collapse" property. It drove me nuts this morning, as this seems to be a bug in some variants of FF/Mozilla and not in others.

    The above solution however now works in all relatively recent versions of IE and FF/Mozilla. Funny that for once it's FF which has the bug (and not IE) ;-), but a bug it is/was.

Topic Closed

This topic has been closed to new replies.

About this Topic