Geek Answers Handbook

Problems displaying IE7 (adding an extra top margin)

I find it very difficult to find out why IE7 is adding additional extras to this page!

This is what IE7 does: http://imgur.com/lwyRI.png

On the right page there will be three black tabs connected to the chart above. Here's what it should look like: also stored on imgur: 64qbf.png (I only have one link allowed)

Link to the page can be found in img. (again I can send only one link)

Please, help!

Css code:

<style type="text/css">
#background{
    background-image: url(/images/store/vaporIronBK.jpg);
    background-repeat:no-repeat;
    height:auto;
    width:665px;

    margin-top:125px;

    margin-left:228px;
    padding-top:5px;
    font-size:15px;
}

#background a {
    color: #ffffff;
    text-decoration: none;
}

#background a:hover {
    color: #de156d;
}

#videoLinks  {
    margin-top:52px;
    height: 100px;
}

#buy{
    width:400px;
    float:left;
    clear:both;
    padding-left:235px;
    color:#000000;
}

#video {
    float: right;
    left: 683px;
    margin-left: 35px;
    margin-top: 166px;
    width: 200px;
    color: #000000;
}

#video a {
    text-decoration: none;
    color: #000000;
}

#video a:hover {
    color: #de156d;
}

#footnotes  {
    color:#ffffff;
    margin-top: 37px;
}

#bottom-text {
    margin-left:40px;
    margin-top:445px;
    width:575px;
}

#bottom-text a {
    color: #de156d;
    text-decoration: none;
}

#bottom-text a:hover {
    color: #000000;
}

#bottom-text p {
    text-align: justify;
}

#bottom-text h2 {
    font-size: 25px;
    color: #000000;
    padding-bottom: 10px;
}

#bottom-text h3 {
    padding-bottom: 5px;
}

#bottom-text p {
    padding-bottom: 20px;
}

#bottom-text .header-text {
    padding-bottom: 25px;
}

#bottom-text p.taylor-image {
    text-align: center;
}

.tabs {
    height: 30px;
    width: 180px;
    float: left;
    margin-left: 30px;
    padding-top: 10px;
}
</style>
+1
source share
5 answers

I do this on every page:

<body>
<!--[if IE]><div class="ie"><![endif]-->

...LALALA

<!--[if IE]></div><![endif]-->
</body>

He triggered a conditional comment. It belongs to IE, but acts as a comment on other browsers and validators.

IE, pre.ie.

.ie # whatthing {position: relative;} !

+1

, CSS do

body
{
    padding:0;
    margin:0;
}

http://www.w3schools.com/css/css_margin.asp http://www.w3schools.com/css/css_padding.asp

, .

0

:

display: inline;

, .

0

margin-top: #background clear:both clear:right #background.

0

, IE7, w/padding margin... , margin-top:? px (? ) , . margin:? Px 0 0 0 .

, IE 7 , , margin padding .

Also, anything floating requires width and with respect to a two-margin error, this only happens when you have a margin on the same side as the side the element is floating ..... so if you declare float: right on something, you don’t want to have a margin: 0 20px 0 0 on the same ... it will be doubled. Better use padding on the containing element.

0
source

More articles:


All Articles