2

私は社内でクライアントサイトに取り組んでいます。特定のCSSがIE7には適用されていないが、IE8,9などでは問題ない場合。

IE7ブラウジングとドキュメントモードでIE9をチェックインしています。

CSS:

ul.default-list {
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 14px;
  margin-bottom: 20px;
}

ul.default-list li {
  padding: 0;
  margin: 0;
  background: url(../images/arrow-red.gif) no-repeat left 6px;
  padding-left: 13px;
  margin-bottom: 17px;
}

.fl {
  float: left;
}

.no-margin li {
  margin: 0;
}

HTML:

<ul class="default-list fl no-margin" sizcache="2" sizset="10">
<li sizcache="0" sizset="20"><a href="#item1">Item 1</a></li> 
<li sizcache="0" sizset="21"><a href="#Item 2">Item 2</a></li>  
<li sizcache="0" sizset="22"><a href="#Item 3">Item 3</a></li>  
<li sizcache="0" sizset="23"><a href="#Item 4">Item 4</a></li>  
</ul>

IE8モードのスクリーンショット

ここに画像の説明を入力してください

IE7モードのスクリーンショット

ここに画像の説明を入力してください

ページのヘッドセクション

<!DOCTYPE html>
<!--[if lt IE 7]> <html class="lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="lt-ie9" lang="en"> <![endif]-->
<!--[if IE 9]>    <html class="ie9" lang="en"> <![endif]-->
<!--[if gt IE 9]><!--> <html lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<link href='http://fonts.googleapis.com/css?family=Droid+Sans:400,700|Droid+Serif:400,400italic,700,700italic' rel='stylesheet' />
<link rel="stylesheet" href="js/fancybox/jquery.fancybox-1.3.4.css" media="all" />
<link rel="stylesheet" href="css/main.css?version=56" media="all"  />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-#####-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<link rel="stylesheet" href="css/about-us.css?version=56" media="all"  />
</head>

最後のCSSファイルは、上記のコードを含むCSSです。

編集:ちょうど今

頭の部分をこれまで剥がしましたが、まだ問題があります

 <!DOCTYPE html>
    <!--[if lt IE 7]> <html class="lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
    <!--[if IE 7]>    <html class="lt-ie9 lt-ie8" lang="en"> <![endif]-->
    <!--[if IE 8]>    <html class="lt-ie9" lang="en"> <![endif]-->
    <!--[if IE 9]>    <html class="ie9" lang="en"> <![endif]-->
    <!--[if gt IE 9]><!--> <html lang="en"> <!--<![endif]-->
    <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="css/about-us.css?version=56" media="all"  />
    </head>
4

1 に答える 1

3

私はあなたのcssを評価しました、あなたのcssに何か問題があります、私がそれから上記のcss全体を取り除くならば、それはうまくいきますul.default-list

編集:

1038私が想定したように、CSSの行に何か問題があります。

ol li:before, ol .num { float: left; margin: 0 4px 0 0; padding: 0 7px 0 0; background: url(../images/bullet.gif) no-repeat 100% 8px; color: #000; content: counters(item, ".") " "; counter-increment: item; }

とライン1046すなわち

ol li:before, ol .num { float: left; margin: 0 4px 0 0; padding: 0 7px 0 0; background: url(../images/bullet.gif) no-repeat 100% 8px; color: #000; content: counters(item, ".") " "; counter-increment: item; }

私はこれらの行で私が間のスペースを削除したcontent: counters(item, ".") " ";はずだと思います、そしてそれは機能します。content: counters(item,".") " "(item,".")

于 2012-07-31T08:15:15.847 に答える