www.webdeveloper.com
Results 1 to 6 of 6

Thread: firefox issue with height/padding

Hybrid View

  1. #1
    Join Date
    Mar 2007
    Posts
    8

    firefox issue with height/padding

    The padding-top and height css properties differs in IE and Firefox.
    This is what happens:
    <h2> Hello</h2>
    Now if we add the style tags
    h2
    {
    background-color:yellow;
    padding-top:10px;
    height:50px;
    }

    In IE ,the height stays fixed as 50px but with Firefox, the height tends to increase as we add the padding-top value.

    Is there any way to fix this in Firefox, ie to have the height fixed at a certain value?

    Please help.

    thanks
    Bindia

  2. #2
    Join Date
    Mar 2006
    Location
    Newcastle NSW Australia
    Posts
    4,033
    NOTHING needs to be fixed in Firefox - the defined size of an elements is the inside dimensions, and padding, margins, and borders add to this. If you are seeing different behaviour in IE, it is because you are not using a valid doctype and IE is in quirks mode with its buggy outdated box model.

  3. #3
    Join Date
    Mar 2007
    Posts
    8
    Pardon me...I am quite a beginner with CSS.
    Is there anything to be done to fix this 'quirk' mode in IE?....any line of css style tags or anything.


    Thanks

  4. #4
    Join Date
    Mar 2006
    Location
    Newcastle NSW Australia
    Posts
    4,033
    This is not css, but basic html - the first line that should appear in your html page is the doctype. For new pages, the most appropriate one to use is html 4.01 strict - so the start of your html should look like
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Your title here</title>
    </head>

  5. #5
    Join Date
    Nov 2003
    Location
    Jerryville, Tejas
    Posts
    11,715
    Centauri is being kind by using the term "outdated." IE's box model is just flat wrong in older versions and in new versions without a proper doctype.

    http://www.quirksmode.com/
    "Debugging is twice as hard as writing the code in the first place. Therefore, if you write the code as cleverly as possible, you are, by definition, not smart enough to debug it." Brian W. Kernighan

  6. #6
    Join Date
    May 2005
    Location
    Gold Coast (MS)
    Posts
    2,216
    Just some additional info.

    Internet Explorer box model bug

    One of many sites covering the "hack" for IE's box model problem:

    Solutions to the Internet Explorer 5 (IE5) Box Model - Hack and others

    Ron

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles