0

IE 8 で次の CSS メニューが表示されないという問題があります - デフォルトのリストが表示されます - 他のブラウザ ( http://interclub.org.uk )で表示されるメニューではありません

IE 8 で表示する CSS またはドキュメントの修正、サポート、または代替案についてアドバイスをお願いします。

HTML ドキュメント タイプ:

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

スクリプトを含めるための HTML:

<link href="../default.css" rel="stylesheet" type="text/css" media="all" />

メニューに使用される CSS:

#menu {
float: right;
width: 1200px;
height: 15px;
padding: 0px 10px 0px 20px;
}

#menu ul {
float: none;
margin: 0;
padding: 10px 0px 0px 50px;
list-style: none;
line-height: normal;


#menu li {
float: left;
}

#menu a {
display: block;
margin-left: 1px;
padding: 7px 8px 7px 8px;
letter-spacing: 1px;
text-decoration: none;
text-align: center;
font-family: 'Passion One', sans-serif;
font-size: 17px;
font-weight: lighter;
color: #fff;
background-color:#009900
}

#menu a:hover, #menu .current_page_item a {
text-decoration: none;
background: #A0190A;
box-shadow: inset 0px 0px 10px 5px rgba(0,0,0,.1);
border-radius: 5px;
color: #fff;
}

メニュー HTML DIV

<div id="menu">
        <ul>
            <li><a href="../draw.htm" accesskey="1" title="">Draw &amp; Results</a></li>
            <li><a href="http://blog.interclub.org.uk" accesskey="9" title="">the 19th</a></li>
            <li><a href="../userarea/contact.php" accesskey="2" title="">Team Directory</a></li>
            <li><a href="../userarea/submit-result.php" accesskey="2" title="">Submit Result</a></li>
            <li><a href="../rules.htm" accesskey="4" title="">Rules</a></li>
            <li><a href="../faq.htm" accesskey="5" title="">FAQ</a></li>
            <li><a href="../supporting-junior-golf.htm" accesskey="3" title="">Supporting Junior Golf</a></li>
            <li><a href="../about.htm" accesskey="2" title="">About the Comp</a></li>
            <li><a href="../contactus.htm" accesskey="6" title="">Contact Us</a></li>
            <li><a href="http://ladies.interclub.org.uk" accesskey="7" title=""><img src="../images/ladieslogo.png" alt="" width="16" height="16" align="top" />Ladies Inter-Club</a></li>

        </ul>
    </div>
4

2 に答える 2

0

ブラウザのサポート

HTML

HTML を検証すると、 42 個のエラーが明らかになりました。主な問題は、無効な HTML が原因である可能性があります。ブラウザーが異なれば、不適切な HTML に対する反応も異なります。

</div>ヘッダーの最後に余分なタグがあるようです。IE8 が別の DOM 構造を作成することによってこれに反応する場合、ヘッダーの CSS セレクターが適用されない可能性があります。

また、多くのイメージ タグには二重引用符が追加されています。それによっても、予期しない結果が生じる可能性があります。

于 2013-03-27T16:53:20.883 に答える
0

境界半径の作業のためにライブラリ1.4.2でこのjqueryを試してください

// This adds 'placeholder' to the items listed in the jQuery .support object. 
jQuery(function() {
   jQuery.support.placeholder = false;
   test = document.createElement('input');
   if('placeholder' in test) jQuery.support.placeholder = true;
});
// This adds placeholder support to browsers that wouldn't otherwise support it. 
$(function() {
   if(!$.support.placeholder) { 
      var active = document.activeElement;
      $(':text').focus(function () {
         if ($(this).attr('placeholder') != '' && $(this).val() == $(this).attr('placeholder')) {
            $(this).val('').removeClass('hasPlaceholder');
         }
      }).blur(function () {
         if ($(this).attr('placeholder') != '' && ($(this).val() == '' || $(this).val() == $(this).attr('placeholder'))) {
            $(this).val($(this).attr('placeholder')).addClass('hasPlaceholder');
         }
      });
      $(':text').blur();
      $(active).focus();
      $('form:eq(0)').submit(function () {
         $(':text.hasPlaceholder').val('');
      });
   }
});
于 2013-11-14T13:21:05.753 に答える