Question

只是想知道是否有人可以帮助我在mac上进行safari的css hack，我正在尝试做的事情在Windows的safari上看起来不错但在mac上看起来不同，

在我的顶部导航中我试图将所有东西都集中在一起，它看起来集中在firefox上，即safari但是在mac上的safari上它没有居中，所以我想给它左边距只能在Safari的safari上看到

  <div id="main_nav">
 <ul>
      <li><a href="about.php">about us</a></li>
      <li><a href="women.php">women</a></li>
      <li><a href="man.php">men</a></li>
      <li><a href="beauty.php">beauty</a></li>
      <li><a href="lust.php">the lust</a></li>
      <li><a href="press.php">press</a></li>
    </ul>
  </div>

  #main_nav {
width:74.7em;
height:2.3em;
position:absolute;
top:13.9em;
left:0;
background:#000;
margin:0 0 0 6.9em;
text-align:center;
  }

 #main_nav ul {
width:49em;
height:1.7em;
color:#FFF;
font-size:1.3em;
letter-spacing:.2em;
text-alight:left;
margin:0 auto 0 auto;
}

#main_nav ul li {
display:inline;
list-style-type:none;
}

#main_nav ul li a {
display:block;
height:1.6em;
float:left;
color:#FFF;
text-decoration:none;
margin:0em 0 0 4em;
padding-top:.2em;
}

#main_nav ul li:first-child a {
margin-left:0.5em;
}

#main_nav ul li a:hover {
background-color:#90F;
}

感谢

Answer 1

我没有要测试的Mac，但是这个CSS似乎可以在Windows上的Safari，Chrome，Firefox，Opera和Internet Explorer中使用。（我只发布了更改的部分）

#main_nav {
    width:74.7em;
    height:2.3em;
    margin:13.9em auto 0;
    background:#000;
    text-align:center;
}

#main_nav ul {
    width:49em;
    height:1.7em;
    color:#FFF;
    font-size:1.3em;
    letter-spacing:.2em;
    text-alight:left;
    margin:0 auto;
}

小事...... #main_nav ul 中的这一行是多余的，因为短格式允许你指定前两个并且对相反的边应用相同的值：

margin:0 auto 0 auto;

所以，等效版本是：

margin:0 auto;

css hack for safari on mac

1 个答案: