Question

CSS重置（yahooReset）在IE和Chrome之间的交叉浏览器中不起作用，为什么所有div元素和字体在chrome中相对较大？如何使两个浏览器兼容？感谢任何建议。请参阅下面的代码：

div#topBar {
  border: 1px solid black;
  margin: 0.2em auto 0em;
  height: 6em;
  background: #74756c;
}
.logo {
  font-family: 'Cinzel', serif;
  /* google font*/
  color: #191970;
  font-size: 350%;
  padding: 0em 0.3em 0em;
  background-color: #E6E6FA;
  text-shadow: 0 0 2px 8px white;
  border: 1px solid #4195fc;
}
div#box {
  margin: 0.6em 0em 1em 1em;
}
nav#navigation {
  float: right;
  font-size: 140%;
  margin: 15px 6px 0px 0px;
}

<body>
  <div id="topBar">
    <div id="box">
      <b class="logo">RaGa</b>
    </div>
    <nav id="navigation">
      <a href="index.html" class="nav-link">Home</a>
      <a href="index.html" class="nav-link">Imprint</a>
      <a href="index.html" class="nav-link">Privacy</a>
      <a href="index.html" class="nav-link">Terms & Conditions</a>	
    </nav>
  </div>

</body>

Answer 1

我认为一些改变会对你有所帮助

更改px
将em更改为px
删除<b>个标签。这很老了。

Answer 2

我找到了答案。在我的代码中，我写了下面的代码

body { font-size:12px } 
/* this will create problems in cross browser rendering */

Google Chrome的默认字体大小为15px，不允许您的代码在此下方呈现，但IE确实如此。

我听说Google停止支持以下代码以重置默认字体大小。

* {
-webkit-text-size-adjust: none;
}

CSS重置无效

2 个答案: