ホームページ > 記事 > ウェブフロントエンド > Firefox では正常に表示されないが、IE78 やその他のバージョンでは正常に表示される_html/css_WEB-ITnose
Firefox では正常に表示されないが、IE78 やその他のバージョンでは正常に表示される_html/css_WEB-ITnose
- WBOYオリジナル
- 2016-06-21 08:47:10914ブラウズ
7列目の不可解なズレは本当に不可解です
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style type="text/css">/* CSS Document */* { margin: 0; padding: 0; }body { font-family: "Microsoft Yahei", Verdana;}/* font-family:Microsoft Yahei*/li { list-style-type: none; }.f12 { font-size: 12px; }.f14 { font-size: 14px; }.fWeight{ font-weight: bolder; }/*链接根据页面要求全局自定义*/a { text-decoration: none; color: #666; }a:hover { color: #00A57E; }/*链接绿色*/.width1020{ width: 1000px; margin-right: auto; margin-left: auto; padding-right: 10px; padding-left: 10px; }#nav { border-top-width: 1px; border-bottom-width: 1px; border-top-style: solid; border-bottom-style: solid; border-top-color: #ddd; border-bottom-color: #ddd;}#nav ul { line-height: 0px; height: 24px; margin-top: 12px;margin-bottom: 12px; background-color: #FF80C0; }#nav li { font-family: "Microsoft Yahei",Verdana; float: left; padding-left: 35px; line-height: 24px; height: 24px; margin-left: 25px; margin-right: 20px; background-color: #FFFF80; }</style></head><body><div id="nav" class="width1020"> <ul class="f14 fWeight"> <li><a href="#">首页</a></li> <li><a href="#">公司简介</a></li> <li><a href="#">栏目之三</a></li> <li><a href="#">栏目之四</a></li> <li><a href="#">栏目之五</a></li> <li><a href="#">栏目之六</a></li> <li><a href="#">栏目之七</a></li> </ul></div></body></html>
ディスカッションへの返信 (解決策)
このような奇妙な問題に遭遇するのは私だけではありません
私もそれに遭遇しました
この原因はテキストノードが原因であることが多いです
あ、投稿を終えるためのポイント
貼り付けたコードをコピーして見てください。 問題ありません。上記の通り、原因は次のとおりです。スペース
#nav li の margin-right: 20px; を削除し、margin-left: 25px; を 44px; に変更します。 。 。ただし、45px に変更すると、同様の状況が発生します。 。
この原因は通常、テキスト ノードによって引き起こされます
ああ、この投稿のポイント
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。