SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Zealot
    Join Date
    Dec 2005
    Posts
    191
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Firefox Knowledge Pls!!!!

    ok i was wondering if anyone had knowledge about firefox and widths.

    Ive been floating a box left and one right and say they are both 150px each and the outer box is 310 that means there should be a 10px gap in the middle.

    Simple maths..

    But firefox disagrees?
    all my floats in i.e have the 10px middles (which i have measured in photoshop) whilst the firefox ones tend to differ?

    Does anyone know a way to avoid/correct this? Or suggestions to try?

  2. #2
    Winemaster bronze trophy BonRouge's Avatar
    Join Date
    Oct 2004
    Location
    Sendai, Japan
    Posts
    2,417
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm guessing you have padding on those floats. You need to subtract the padding from the widths.

    width:140px + padding:10px = a real width of 150px.

    If IE is behaving differently, you probably don't have a complete DTD.

  3. #3
    SitePoint Zealot
    Join Date
    Dec 2005
    Posts
    191
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    DTD whats that mean?

    i thought subtraction was only needed for margins as padding is internal?

  4. #4
    SitePoint Zealot
    Join Date
    Dec 2005
    Posts
    191
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    are we talking doc type here?

  5. #5
    Winemaster bronze trophy BonRouge's Avatar
    Join Date
    Oct 2004
    Location
    Sendai, Japan
    Posts
    2,417
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i thought subtraction was only needed for margins as padding is internal?
    Erm... no.

    You need this on the first line:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

  6. #6
    SitePoint Enthusiast
    Join Date
    Oct 2004
    Location
    Canada
    Posts
    86
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    According the box model padding and borders are added on top of what you specify the width as. So:

    width: 150px;
    padding: 10px;
    border: 1px solid #000;

    Gives you a box that is 172px (150 + 10 + 10 + 1 + 1)

  7. #7
    SitePoint Zealot
    Join Date
    Dec 2005
    Posts
    191
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    nice one ill look into it tomorrow and get back to you on the results cheers for now! you learn something everyday! cheers guys


Bookmarks

Posting Permissions

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