インターネットエクスプローラーのCSSの問題 - 私のスライダーが狂っている

Question

私は現在ウェブサイトを構築中です。

インターネットエクスプローラでは、ナッツを運転しています。

私は2つのスライダをウェブサイトに持っています。インターネットエクスプローラでブラウジングしているうちに、すべてが狂ってしまいます。

Firefox/Chromeは正常ですが、Explorerではありません。

これを修正する方法についてのヒントを教えてください。スライダーのページ間を移動するのに使用される各スライダーの下部に

Webページ http://makeitweb.se/

Answer 1

[OK]を、私の知る限り、IE 7で誤動作唯一の要素は、ページャ（小さな青いドット）であります。これは、ドットが<li>の要素で、スタイルがdisplay: inline-blockでIE7ではサポートされていないためです。これは、<li>要素を中心にするために使用されます。あなたは素早く簡単ですが汚い修正はそれはあなたがこれを追加することができます唯一のIE 7の実際のクラスをオーバーライドし、のstyle.cssで2クラスの定義を追加することです

IE 7に、このための回避策を必要としますインラインCSSスタイルのページでの後にの後にstyle.cssファイルが含まれています。

<!--[if lte IE 7]> 
<style type="text/css"> 
.bx-pager { 
    display: block; width: 80px; margin-left: 400px; 
} 
div.bx-pager li { 
    display: inline; float: left; 
} 
</style> 
<![endif]--> 

なぜこれは汚いですか？スライダボックスの数が変わると、width: 80pxの部分とmargin-left: 400pxの部分も変更する必要があります。自動センタリングは行われません。固定マージンです。

今、それを正しく行うために、代替はページャの<li>要素の周りに別の<div>を追加するbxSlider.jsコードを変更することであり、DIV（margin: autoが）それはの中央に取得することをスタイル既存の親div（現在はクラス.bx-pagerを取得しています）。

こちらがお役に立てば幸いです。