[英]why looks my margin different in chrome as in all other browsers
[英]My height attribute is showing different results in firefox than all the other browsers (safari,chrome act). Why?
我的布局简单,firefox中的徽标似乎有所不同,在所有浏览器中似乎都看不到均匀,因为当我在蓝色框中更改字母'f'的高度时,它会影响所有浏览器。
我遇到的问题是div“ logofoxfont”,因为我希望字母“ f”在所有浏览器中都位于同一位置,但在firefox中似乎有所不同。
我该如何分类?
<html>
<head>
</head>
<link href="fw.css" rel="stylesheet" type="text/css">
<body>
<div class="topbox">
<div class="logobox"><div class="logoboxfont">
f</div></div>
<div class="logotext"></div>
</div>
<div class="midbox">
<div class="menubox"><div class="menuboxfont">Home<br>About Us<br>Staff<br>News<br></div>
<div class="menubox2"><div class="menuboxfont2">Appointments<br>
Price Guide<br>Emergency Services<br>Feedback<br></div></div></div>
</div>
</body>
</html>
CSS是:
#logo{
background-image:url(40.jpg);
height:100px;
width:100px;
}
.topbox {
margin: 0px auto;
height:100px;
width:900px;
margin-top:0px;
background: #ffffff;
}
.logobox {
height:90px;
width:70px;
margin-top:10px;
background-color:#2FB2F4;
}
.logotext {
color: #333333;
font-family: Cambria;
font-size: 18px;
margin-top: -90px;
margin-left: 75px;
position:absolute;
}
#logotext1 {
margin-left:10px;
}
#logotext2 {
color: #00AAF5;
font-family: georgia;
font-size: 22px;
margin-top: -35px;
margin-left:10px;
}
.logoboxfont {
font-family:Cambria;
color: #ffffff;
font-size: 126px;
position:absolute;
margin-top:-20px;
margin-left:0px;
-moz-transform:rotate(10deg);
-webkit-transform:rotate(10deg);
-o-transform:rotate(10deg);
-ms-transform:rotate(10deg);
}
.midbox {
margin: 0px auto;
height:700px;
width:900px;
margin-top:0px;
background: #ffffff;
border-top: 1px solid #333333;
}
.menubox {
height:230px;
width:150px;
margin-top:10px;
background: #E6E6E6;
}
.menuboxfont {
color: #333333;
font-family:lucida grande;
font-size: 12px;
margin-top: 4px;
margin-left: 4px;
position:absolute;
}
.menubox2 {
height:160px;
width:150px;
margin-top:70px;
background: #FAFAFA;
position:absolute;
}
.menuboxfont2 {
color: #333333;
font-family:lucida grande;
font-size: 12px;
margin-top: 4px;
margin-left: 4px;
position:absolute;
}
谢谢您的帮助!
詹姆士
参见小提琴以获得代码和演示:
小提琴: http : //jsfiddle.net/kHtmf/1/
演示: http : //jsfiddle.net/kHtmf/1/embedded/result/
Firefox的SS:
铬的SS:
Safari的SS:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.