0
私はFirefox 3.0.9で自分のサイトで作業しています（そして非常に緑色です）。しかし、私は上に横たわる水平なナビゲーションバーを持っているように見えます。ここで私がこれまで試みたことは次のとおりです。IE 7は私の水平ナビゲーションバーをダブルラインに変えています
1）余白を調整し、パディングをゼロにして、背景画像の幅を変更しました。
2）私はIE7フォルダを作成してブラウザに別のスタイルシートを付けようとしましたが効果はありません。
3）IE7.jsを使用して問題を解決しようとしましたが、効果はありません。
IEは私をひどく運転しています！何かご意見は？ここに私のCSS & HTML（笑い;-)）
ありがとう！
/---私のCSS ---/
#body {
margin: 0px 0px 20px 0px;
text-align: center;
background: #450000 url(images/greenstrip.jpg) repeat-x right top;
}
#maincontainer {
width: 720px;
border-width: 8px;
border-color: #fff;
border-style: solid;
position: absolute;
margin-left: 50%;
left: -360px;
margin-right: auto;
}
#box p {
position: absolute;
color: #fffceb;
width: 450px;
margin-top: 275px;
margin-left: 16px;
background: #373635;
font-size: medium;
font-family: "arial rounded mt bold", "times roman";
text-align: left;
line-height: 1.5em;
padding-left:7px;
padding-right:7px;
padding-bottom:7px;
border-style:solid;
border-color:#bec783;
border-width: 3px;
}
#lowerbox p {
position: absolute;
color: #fffceb;
width: 450px;
background: #373635;
font-size: medium;
font-family: "arial rounded mt bold", "times roman";
text-align: center;
line-height: 1.5em;
padding-left:7px;
padding-right:7px;
padding-bottom:7px;
border-style:solid;
border-color:#bec783;
border-width: 3px;
width: 450px;
margin-top: 433px;
margin-left: 16px;
}
#featured p {
position: absolute;
color: #000;
width: 270px;
margin-top: 825px;
margin-left: 128px;
background: none;
font-size: small;
font-family: "arial rounded mt bold", "times roman";
text-align: center;
line-height: 1.5em;
}
#customize p {
position: absolute;
color: #000;
width: 270px;
margin-top: 825px;
margin-left: 420px;
background: none;
font-size: small;
font-family: "arial rounded mt bold", "times roman";
text-align: center;
line-height: 1.5em;
}
.name {
font-weight: bold;
font-style: italic;
color: #bec783;
}
ul {
margin: 0px;
width: 680px;
line-height: 0em;
list-style: none;
font-size: medium;
font-family: "arial rounded mt bold", "times roman";
float: left;
background: url(images/button.gif);
}
ul a {
display: block;
padding: 0 1.2em;
line-height: 2.2em;
text-decoration: none;
color: #fff;
float: left;
margin-left: 6px;
margin-right: 0;
}
ul li {
float: left;
width: auto;
}
ul a:hover {
color:#f26214;
}
ul a:visited {
text-decoration: none;
}
#textpad ul {
position:absolute;
width:100px;
margin-top: 335px;
margin-left: 481px;
background: none;
text-decoration: none;
}
.promise a {
display: block;
color:#000;
line-height: 1em;
font-size: 30px;
font-family: "freestyle script";
width:150px;
}
.promise a:visited {
text-decoration: none;
}
#fet a:link, #fet a:visited {
text-decoration:none;
color: #000;
}
#fet a:hover {
color:#f26214;
}
<!---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">
<head>
<title>Core 4 Innovative: Website Solutions For Your Small Business</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="keywords" content=" core 4,web,webpage developer,design,web designer, freelance,low cost" />
<meta name="robots" content="index,follow" />
<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE7.js" type="text/javascript"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body id="body">
<div id="maincontainer">
<table id="Table_01" width="720" height="961" border="0" cellpadding="0" cellspacing="0">
<ul id="nav">
<li><a href="http://www.core4innovative.com/home.html">Home</a></li>
<li><a href="http://www.core4innovative.com/about/about.html">About Us</a></li>
<li><a href="http://www.core4innovative.com/process/our_process.html">Our Process</a></li>
<li><a href="http://www.core4innovative.com/services/services.html">Our Services</a></li>
<li><a href="http://www.core4innovative.com/contact/contactus.aspx">Contact Us</a></li>
</ul>
<div id="textpad">
<ul>
<li class="promise"><a href="#">Affordable Web Hosting Starting at $9.99 per month!<a></li>
</ul>
<div id="box">
<p><span class="name">Core 4 Innovative</span> puts your online success within reach. Using our affordable
website solutions, unique development process and standardized
methods for design you can be sure to recieve a customized product that adds value to your business!</p>
</div>
<div id="lowerbox">
<p><span class="name">We Serve Every Major Industry:</span></br>
Restuarants • Real Estate • Insurance • Entertainment • Apparel • Automotive • Energy • Professional Services</p>
</div>
<div id="featured">
<p><span id="fet"><a href="http://www.core4innovative.com/portfolio/portfolio.html" alt="our featured client">Our Featured Client</a></span></p>
</div>
<div id="customize">
<p>Customize Your website</p>
</div>
<tr>
<td colspan="3">
<img src="images/top.jpg" width="720" height="12" alt=""></td>
</tr>
<tr>
<td>
<img src="images/logo.jpg" width="258" height="137" alt=""></td>
<td colspan="2">
<img src="images/apple_graphic.jpg" width="462" height="137" alt=""></td>
</tr>
<tr>
<td colspan="3">
<img src="images/topdivider.jpg" width="720" height="48" alt=""></td>
</tr>
<tr>
<td colspan="2">
<img src="images/topdivider-06.jpg" width="502" height="3" alt=""></td>
<td rowspan="2">
<img src="images/notepad.jpg" width="218" height="305" alt=""></td>
</tr>
<tr>
<td colspan="2">
<img src="images/getaquotebox.jpg" width="502" height="302" alt=""></td>
</tr>
<tr>
<td colspan="3">
<img src="images/roundboxes.jpg" width="720" height="370" alt=""></td>
</tr>
<tr>
<td colspan="3">
<img src="images/footer.jpg" width="720" height="88" alt=""></td>
</tr>
<tr>
<td>
<img src="images/spacer.gif" width="258" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="244" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="218" height="1" alt=""></td>
</tr>
</table>
</div>
</body>
</html>
「css」と「html」タグを追加して、もっと多くのユーザーに見せてもらえますか？ – Alconja
...もっと簡潔なコードのために「短手セレクタ」を調べたいかもしれません。 – alex