IE shows site correct - Firefox not

Discussion in 'HTML' started by Daniel Forster, Jan 30, 2005.

  1. When you look at http://www.jgtranslations.ch/, IE shows the site correct
    but Firefox doesn't. It seems that Firefox doesn't handle the statement
    height:51px in the following part of stylesheet.css correct.... How can I do
    it in a way that both browsers do show it correct??? I do not want to use
    tables, because of cms-reasons.

    thanks, Peter

    h1,h2,h3
    {font-size:13px;font-weight:bold;background-color:#FFFFFF;height:51px;border-bottom:
    1px solid #000000;padding-top:16}

    li.doc,li.sdoc,li.docs,li.sdocs{line-height:1.5;display:inline;padding-left:15px}

    ul.search{padding-left:0;margin-left:0;list-style:none;text-decoration:none}
     
    Daniel Forster, Jan 30, 2005
    #1
    1. Advertising

  2. Daniel Forster

    Steve Pugh Guest

    "Daniel Forster" <> wrote:

    >When you look at http://www.jgtranslations.ch/, IE shows the site correct
    >but Firefox doesn't.


    I bet it's actually the other way round.

    >It seems that Firefox doesn't handle the statement
    >height:51px in the following part of stylesheet.css correct.... How can I do
    >it in a way that both browsers do show it correct??? I do not want to use
    >tables, because of cms-reasons.


    >h1,h2,h3
    >{font-size:13px;font-weight:bold;background-color:#FFFFFF;height:51px;border-bottom:
    >1px solid #000000;padding-top:16}


    Your doctype triggers quirks mode so IE includes borders and padding
    inside the width/height. So in IE the total height of your headings
    from outside edge of the top border to the outside edge of the bottom
    border will be 51px.

    In decent browsers the total height might be 51px + 1px for the bottom
    border, or it might be 51px + 1px for the bottom border + 16px for the
    top padding. All depending on whether they chuck out your incorrect
    unitless length or not.

    You can make IE6 behave properly by using a different doctype, but IE5
    will always be broken.

    And then there's also margin collapsing to take into account which
    again FF tends to get right and IE tends to get wrong.

    Setting font sizes in pixels is a bad idea - Win IE users can't resize
    the text except by disabling all font sizing. I would drop the pixel
    font size and adjust the rest of the design so that text of any size,
    and thus a <h1> of any height, works.

    You should also fix the syntax errors:
    http://validator.w3.org/check?uri=http://www.jgtranslations.ch/
    http://jigsaw.w3.org/css-validator/...www.jgtranslations.ch/&warning=1&profile=css2

    If you really just want to hack it so that FF gets a different height
    value in the CSS then feast your eyes on all the dozens of CSS hacks
    at http://www.dithered.com/css_filters/
    But don't be surprised if hammering it flat in one place causes it to
    pop up in another.

    Steve

    --
    "My theories appal you, my heresies outrage you,
    I never answer letters and you don't like my tie." - The Doctor

    Steve Pugh <> <http://steve.pugh.net/>
     
    Steve Pugh, Jan 30, 2005
    #2
    1. Advertising

  3. "Daniel Forster" <> wrote:

    > {font-size:13px;font-weight:bold;background-color:#FFFFFF;height:51px;bo
    > rder-bottom: 1px solid #000000;padding-top:16}


    You should start from checking your CSS syntax using the so-called CSS
    Validator at http://jigsaw.w3.org/css-validator/

    Conforming browsers ignore declaration padding-top:16, while conconforming
    browsers such as IE might make guesses on what the author meant, attaching
    some unit to the number 16.

    Besides, you should stop using px values especially since they fix the size
    on IE.

    --
    Yucca, http://www.cs.tut.fi/~jkorpela/
    Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html
     
    Jukka K. Korpela, Jan 30, 2005
    #3
  4. Daniel Forster

    Richard Guest

    Better. Trash IE all together.
     
    Richard, Jan 31, 2005
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. gce
    Replies:
    0
    Views:
    773
  2. Dan

    correct or not correct?

    Dan, Oct 2, 2003, in forum: HTML
    Replies:
    7
    Views:
    445
  3. Joker7

    ie shows ok firefox not ok

    Joker7, Jun 15, 2005, in forum: HTML
    Replies:
    2
    Views:
    504
    Joker7
    Jun 16, 2005
  4. OccasionalFlyer

    Page shows in FIrefox, IE7 but not IE6

    OccasionalFlyer, Dec 4, 2008, in forum: HTML
    Replies:
    4
    Views:
    443
    Chaddy2222
    Dec 5, 2008
  5. Gianni

    IE shows false and Firefox shows true

    Gianni, Jul 10, 2009, in forum: Javascript
    Replies:
    3
    Views:
    458
    Thomas 'PointedEars' Lahn
    Jul 10, 2009
Loading...

Share This Page