Firefox /其他浏览器之间的对齐转换

时间:2014-06-10 02:58:35

标签: html css firefox alignment

http://jsfiddle.net/Fy5v8/

我一直无法解决这个问题,或者之前看到它很微妙,但我当然希望它是完美的。我没有看到为什么它应该显示奇怪的原因。

图像的底部和导航应该对齐,但不是。这是firefox中不正确的版本:

http://jamimiles.com/firefox.png

或者在您自己的浏览器上访问它。非常感谢你的帮助!

#header {
font-family: georgia, serif;
width:800px;
height:65px;
font-size:20px; font-size:2rem;
color:#3a3b59;
text-transform: uppercase;
text-align:left;
padding:0 0 30px 0;
margin-top:0;
border-bottom: none;
float:left;
position:relative;
}
#header ul li {
list-style-type:none;
line-height:20px; line-height:2rem;
float:right;
}

#header li {
padding-left:20px;
}

#header ul {
margin-top:52px;
padding:0;
float:right;
margin-bottom:0;
}

#header img {
padding:0; 
border:none;
float:left;
}

这就是CSS。这是标题带。

    <div id="header">
    <a href="index.html"><img src="images/namebanner3.png"></a>
        <ul>
            <li><a href="index.html">home</a></li>
            <li><a href="about.html">about</a></li>
            <li><a href="portfolio.html">portfolio</a></li>
                            <li><a href="JamiMiles_Resume.pdf" target="blank">resum&eacute;</a></li>
            </ul>
</div>

1 个答案:

答案 0 :(得分:0)

尝试调整img px。您目前设置为851像素×141像素

<img  height="#" width="#" style="-webkit-user-select: none"     

 src="http://jamimiles.com/firefox.png">