All Posts by Email, Once a Week

Media Temple logo

CSS-Tricks is brought to you in part by Media Temple, the web hosting that we both use and recommend.

IE 8 displays width/height of div differently

  • # September 1, 2009 at 3:16 pm

    Below is the code for this site (http://netimpact.org/displaycommon.cfm? … lenbr=2974)

    Code:

    The size of the div box (with the transparent background) atop the image has a completely different width/height in IE 8 than it does in FF or Chrome. I know that IE does funky things with padding and margins, but thought that IE8 solved the box model problem. Can’t figure this out for the life of me.

    Any insights into why the box would have a different width/height in IE8

    Cheers.

    # September 1, 2009 at 5:54 pm

    Well I found a solution to the problem, though it seems to be a bloated solution. I just wrapped the content div in a container, and applied the padding to the inside div and the width to the container. It now displays the exact same size in IE, Firefox and Chrome. Thoughts? Is this an OK solution?

    Code:
    #container{
    background: url(http://www.netimpact.org/associations/4342/files/membership/transpBlack.png) repeat scroll 0 0;
    width: 200px;
    left:496px;
    top:19px;
    position:relative;
    }
    #content {
    padding:8px 12px;
    font-family: Trebuchet MS,Verdana,Arial,Helvetica,sans-serif;
    font-size:13px;
    }
    Code:

    CONTENT

    Thanks,

    Redleaf

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed