2012-03-28 17 views
0

http://www.caseen.com/store.htmlをご覧ください。 FirefoxとChromeの両方で素晴らしいですが、IE9では見えません。何が起こっているのか見てみる=ie9/CSS:ie9ではフライアウトメニューが機能しませんが、Firefox/Chromeでうまくいきます。

ie9はスタイルシートを無視しているようですが、エラーチェックとie9ダイレクトモードをクリックすると、リンクの周りに巨大な厄介な白い罫線が表示されます。

私のコードを参照してください:

<div class="flyout"> 
          <ul> 
          <!--START: CATEGORIES--> 
          <!--START: CATEGORY_FORMAT--> 
          <li><a href="view_category.asp?cat=CATID">&nbsp;CATEGORY</a> 
          <!--END: CATEGORY_FORMAT--> 
           <ul><!--START: SUB_CATEGORY_FORMAT--> 
            <li><a href="view_category.asp?cat=CATID">&nbsp;CATEGORY</a></li> 
          <!--END: SUB_CATEGORY_FORMAT--></ul> 
          <!--END: CATEGORIES--> 
          </li> 
          </ul> 
          </div> 

とCSSを

.flyout { 
width: 130px; 
height: auto; 
position:relative; 
margin: -10 0; 
padding: 0; 
z-index:10000; 
} 

.flyout ul li a { 
display:block; 
text-decoration:none; 
color: #fff; 
width: 130px; 
border: solid; 
border-color: #000; 
border-width: 0 0 0 5px; 
text-align:left; 
font-size:12px; 
line-height: 25px; 
} 

.flyout ul { 
padding:0px; 
list-style-type: none; 
} 
.flyout ul li { 
float:left; 
margin-right:1px; 
position:relative; 
} 
.flyout ul li ul { 
display: none; 
} 

.flyout ul li:hover a { 
border: solid; 
border-color: #fff; 
border-width: 0 2 0 5px; 
color: #60dfe5; 
} 

.flyout ul li:hover ul { 
display:block; position:absolute; top:0; 
left:130px; 
width:10px; 
} 
.flyout ul li:hover ul li a.hide { 
background:#000; 
color:#fff; 
} 

.flyout ul li:hover ul li:hover a.hide {width:180px;} 
.flyout ul li:hover ul li ul {display: none;} 
.flyout ul li:hover ul li a { 
display:block; 
background:#000; 
color:#60dfe5; 
width:200px; 
} 
.flyout ul li:hover ul li a:hover { 
background:#000; 
color:#fff; 
} 

答えて

2

IE9は、サイト上のQuirksモードをデフォルトされているので、可能性のsomethinがありますあなたのマークアップ、doctype、または一般的な構造のいずれかに間違っています。

は、この検証報告書を見てみましょう:

http://validator.w3.org/check?uri=http%3A%2F%2Fwww.caseen.com%2Fstore.html&charset=%28detect+automatically%29&doctype=Inline&group=0

をあなたは閉じられていないタグや他の主要な問題の数を持っています。 IEはおそらくこれらを窒息させ、クォークモードを引き起こしています。まず、その可能性を排除するためにマークアップをクリーンアップすることをお勧めします。それは本当に関係なく起こるはずです。

+0

...私が表示されます私は何をすることができますありがとう。それでもIE9は、ホバースとそのようなものの境界を嫌うように見える=( – Brandon

+0

ありがとう!それは助けになったようだ! – Brandon

+0

素晴らしい。喜んで助けた。 –

1

あなたのDOCTYPE宣言が間違っている、それは次のようになります。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

私がお勧めしたいけどHTML5s DOCTYPE:CMSは、古いスタイルテンプレートに付属

<!DOCTYPE html> 
関連する問題