app.css

Question

IE6,7在浏览器显示屏上给我带来了悲伤。我没有Safari和FF的问题。我不是CSS专家，需要有关IE上此列对齐问题的建议。而且我不知道从哪里开始，因为我已经尝试搞乱css文件和css浏览器选择器javascript，但仍然无法让它在IE上工作。

我认为存在的问题主要围绕id doc，bd，yui-main，yui-b，box和box-titles。由于不明原因，IE中的尺寸与其他更好的浏览器不同。尺寸宽度和高度值不同。

<body>
  <div id="doc" class="yui-t2">
    <div id="bd">
      <div id="yui-main">   
        <div class="yui-b">
          <div id="header" class="yui-g">
            <a href="index.php">
:
:

不幸的是，2个css文件对我来说有点让人难以理解。我试着在这里粘贴它，但格式没有受到打击。

有人可以伸出援助之手吗？

感谢任何帮助。

app.css

body {
  font-size: 85%;
  font-family: "georgia";
}

.yui-t2, #bd, #yui-main {
  z-index: -5;
}

.yui-b, .yui-g {
  z-index: auto;
}

div.yui-b div.box {
  color: #333333;
  border: 1px solid #c6e1ec; /* this controls the left boxes on front page */
  margin-top: 15px;
}

div.yui-b div p.box-title {
  /* background: #0590C7; 
  border-bottom: 2px solid #c6e1ec; */
  background: #6f6f6f; 
  border-bottom: 2px solid #c6e1ec;  
  color: #FFFFFF;
  display: block;
  font-size: 93%;
  font-weight: bold;
  margin: 1px;
  padding: 2px 10px;
}

div.yui-b div ul {
  margin: 0;
}

div.yui-b div ul li {
  border-bottom: 0px solid #fff;
  list-style-type: none;
}

div.yui-b div ul li a {
  color: #333333;
  display: block;
  text-decoration: none;
  padding: 3px 10px;
}

div.yui-b div ul li a:hover {
  background: #c6e1ec;
  color: #333333;
}

网格-min.css

body
 {text-align:center;}

#doc,#doc2,#doc3,#doc4,.yui-t1,.yui-t2,.yui-t3,.yui-t4,.yui-t5,.yui-t6,.yui-t7
  {margin:auto;text-align:left;width:57.69em;*width:56.301em;min-width:750px;}

.yui-b{position:relative;}
.yui-b{_position:static;}

#yui-main .yui-b{position:static;}
#yui-main
  {width:100%;}

.yui-t1 #yui-main,.yui-t2 #yui-main,.yui-t3 #yui-main
  {float:right;margin-left:-25em;}

.yui-t4 #yui-main,.yui-t5 #yui-main,.yui-t6 #yui-main
  {float:left;margin-right:-25em;}

:
:

更多但是在stackoverflow格式化不好以使其可读。

我道歉，因为我不希望在这篇文章中看到无益或粗鲁。

此致

Answer 1

这是一般用于处理ie6的有用资源 http://www.virtuosimedia.com/dev/css/ultimate-ie6-cheatsheet-how-to-fix-25-internet-explorer-6-bugs

Answer 2

有许多可能的IE6 / 7问题。特别是IE6。

要检查的第一件事是您的HTML代码是否包含有效的<!DOCTYPE>声明？如果没有，您的页面将进入怪癖模式，这将使IE的所有版本（特别是IE6）变得疯狂。 Quirks模式实际上是IE5兼容模式。它被严重破坏，所以请确保你有一个doctype。

要做的第二件事是阅读一些可能会给您带来问题的IE问题，以及浏览器对您可能正在使用的某些功能的支持。有一个非常好的网站（足够恰当）Quirksmode.org，它有一套全面的兼容性表格，可用于各种浏览器功能。

以下网站也可能有所帮助：

谷歌也是你的朋友。 ; - ）

下一个提示，尝试缩小您的问题范围。删除正在工作的位，直到最终得到一个显示问题的页面，其他的东西会阻碍。将该示例保存到JSFiddle这样的网站。如果您确切知道问题是什么，那么解决问题会更容易。

最后，如果剩下的问题是不会阻止页面被使用的次要显示故障，您应该允许自己简单地忽略它们。 IE6和7的市场份额在过去一年中迅速下降，并将继续下降。在这些浏览器中花费太多时间来解决小问题，这几乎无法获得。

请点击此处查看最新的浏览器使用情况统计信息：http://gs.statcounter.com/#browser_version-ww-monthly-200911-201011 （显然，如果您的网站有明显不同的人口统计数据，您可能需要更多关注IE6和7，但如果是这种情况您就已经知道了）

CSS跨浏览器问题

app.css

网格-min.css

2 个答案: