CSS在Internet Explorer中无法正常工作? (绝对定位)

时间:2013-03-18 01:53:56

标签: html css internet-explorer compatibility

页面上的很多其他内容也使用绝对定位,但由于某种原因,“投票”和“个人资料”按钮在右侧显示数百个像素,在Internet Explorer 9/10中显示约50个像素(8-这里不是问题)。 HTML中没有样式,它就在这里。有什么突出的吗?谢谢!

        .contain{
        margin-left:-65px;
        margin-top:-85px;
        position:absolute;

    }
    .video_display1{
        background-color:#333;
        width:250px;
        height:200px;
        margin-top:40px;
        margin-left:88px;
    display:inline;
    }
    .profile1{
        width:49px;
        height:12px;
        margin-left:87px;
        margin-top:3px;
        position:absolute;
    }
    .vote1{
        margin-top:3px;
        margin-left:240px;
        position:absolute;
    }
    .display_vote1{
        margin-left:295px;
        margin-top:2px;
        font-size:11px;
        position:absolute;
    }

这是HTML:

            <span class="contain">
                <iframe class="video_display1" width="250" height="200" src=""> </span>
                <span class="profile1"><img src=''/></span>     
                <span class="vote1"><input type="image" src=''/></span>             
                <span class="display_vote1"></span>
            </span>

和DOCTYPE:

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

1 个答案:

答案 0 :(得分:0)

您尚未定义图像的宽度和高度,因此要获得固定的高度和高度。 width首先定义它。在display: inline-block;中使用.contain然后只有你得到你想要的东西。