我有一个网站，我的容器盒有圆角，圆角可以在IE9以外的所有其他浏览器中使用。这是我网站的链接：http://www.canadiannaturephotographer.com/~teacher/Kelsey/index.html 这是html代码：
<!doctype html>
<head>
<html lang="en">
<meta charset="utf-8">
<meta name="description" content="Kelsey's fishing site provides information on locations to fish, fishing equipment, and fish trophies.">
<meta name="keywords" content="fishing, site, net, bait, catch, release, trophy, fish, guide, locations, location, best, educational, tutor, instruction, equip, equipment, contact, feedback, about, how, to, fishing rod, rod, fly, fly-fish, fly fishing, hook, angler, angle, angling, fishes, wire, product, electronic, gps, navigation, vest, beer, pike, salmon, wall-eye, whitefish, white fish, trout, rainbow, herring, mountain, nature, valley, river, lake, ocean, shore, coast, dock, fly fish, worm, maggot, dry, ice, season, winter, fall, summer, spring, price, best, spot, to, go, calgary, alberta, canada, north america, travel, boat, motor, buoyancy, float, floaty, bobber, bob, bobbing, weight, reel, reeling, in, big, giant, huge, massive, large, aquatic, life, aqua, water, sand, tackle, tackle box, box, live, insects, insect, hunt, outdoors, outdoorsman, wildlife, food, cook, wild, out,">
<title>About ~ Kelsey's Fishing Site</title>
<link href='http://fonts.googleapis.com/css?family=Scada' rel='stylesheet' type='text/css'>
<link href='cssfishsite.css' rel='stylesheet' type='text/css'>
<link rel="icon" type="image/ico" href="images/faviconn.ico">
</head>
<body>
<div id="container">
<header><center><img src="images/fishing-banner.jpg" class="topround"></center></header>
<nav>
<ul>
<li><a class="navbarr" href="index.html">About</a></li>
<li><a class="navbarr" href="fishingtrophies.html">Trophies</a></li>
<li><a class="navbarr" href="fishinglocations.html">Locations</a></li>
<li><a class="navbarr" href="fishingequipment.html">Equipment</a></li>
<li><a class="navbarr" href="contact.html">Contact</a></li>
<li><a class="navbarr" href="feedback.html">Feedback</a></li>
</ul>
</nav>
<article>
<img id="trophyp" src="images/trophypike.jpg" width="200" height="340" alt="Very large trophy pike" title="Massive trophy pike" align="left"><p id="mainpagetitle">Featured Trophy Fish</p>
<p class="paratag"><span class="description1">Length:</span> 56"</p>
<p class="paratag"><span class="description1">Weight:</span> 55 lb</p>
<p class="paratag"><span class="description1">Location:</span> Turtle Lake, Saskatchewan</p>
<p class="paratag"><span class="description1">Story:</span> This fish was caught in the open waters of Turtle lake when the fisherman caught a 36" Pike. As he was reeling the pike in, the 50 lb pike tried to eat it! The fisherman caught them both in the same net. <br /><br /> Wow!!</p>
<br />
</article>
<br /><br />
<br />
<hr />
<br />
<div id="box32"><img id="trophyp2" src="images/E-_Kelsey'sfishingsite_images_2110612-636818-fresh-bright-trout-fish-isolated-on-a-white-background.gif" width="240" height="160.5" alt="bright trout fish" title="Fresh Bright Trout" align="right"><p><div id="textbox2"><span class="darkblue">Welcome!</span><span class="fonteh"> This website has been created to educate user's on fishing locations within Alberta, what fishing gear to utilize, etc. This website also allows users to post their trophy fish with a chance to be featured on the homepage. I hope you enjoy the website and please send feedback!</span></p></div></div>
<br />
<br />
<hr />
<p id="thirdpagetitle">Submit Your Trophy Fish!</p>
<form method="post" action="trophyfishsubmit.php" align="center">
<fieldset style="padding: 10px;" bgcolor="white"><div class="whiteformbox"><br />
<center>Name: <br /><input type="text" name="name" id="name"> <br /><blockquote></blockquote>
Location: <br /><input type="text" name="location" id="location"><br /><blockquote></blockquote>
Fish: <br /><blockquote></blockquote>
<input type="text" name="fish" id="fish">
<br />
<p>Story: </p>
<textarea cols="50" rows="9" name="story"></textarea><br />
<p>Please send your photos to my E-mail at: <br /><br />
<a href="mailto:k.nealon@hotmail.com">K.nealon@hotmail.com</a></p>
<br />
<input type="submit" name="submit" value="Send">
<p><strong><font size="2">Privacy Policy:</strong> All information gathered in this form will be kept strictly confidential and will not be exploited in any way.</font></p></center><div></fieldset>
</form>
<br />
<br /><br />
<footer><p align="center">Last Updated October 4th, 2013 ~ Calgary, Alberta</p></footer>
</div><!-- this is the container end div tag -->
<br />
<center><font face="verdana"><a class="sitemap" href="sitemap.html">Sitemap</a></font></center>
</body>
</html>
现在这里是CSS：
#container {
width: 761px;
background-color: beige;
border-radius: 10px;
border: 1px solid black;
margin: 0 auto;
font-family: Verdana, Arial, Sans-serif;
}
body {
background-color: white;
background-image: url("images/clouds.jpg");
background-repeat: no-repeat;
background-position: top;
}
.description1 {
color: #2caeec;
}
.paratag2 {
padding-left: 180px;
width: 410px;
}
.paratag {
padding-left: 280px;
}
nav {
font-style: bold;
font-size: 0.8em;
background-color: #b1b1b1;
color: red;
margin-right: 0.07px;
margin-top: -3px;
}
#box32 {
width: 750px;
}
#textbox2 {
width: 400px;
padding-left: 50px;
height: 150px;
}
.darkblue {
color: darkblue;
}
.fonteh {
color: #2caeec;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
}
li {
float: left;
}
.header1s {
color: #2caeec;
}
.boxie {
border: 10px solid black;
border-radius: 5px;
width: 300px;
height: 260px;
}
.stang {
color: #2caeec;
}
#information1 {
width: 430px;
margin: auto;
}
#information24 {
width: 600px;
margin: auto;
color: #2caeec;
font-size: 1.1em;
}
#mainpagetitle {
font-family: 'Scada', sans-serif;
font-weight: bold;
font-size: 3.0em;
color: #2caeec;
padding-left: 270px;
}
#mainpagetitle2 {
font-family: 'Scada', sans-serif;
font-weight: bold;
font-size: 3.0em;
color: #2caeec;
padding-left: 365px;
}
#sitemap1 {
font-family: 'Scada', sans-serif;
font-weight: bold;
font-size: 3.0em;
color: #2caeec;
}
#thirdpagetitle {
font-family: 'Scada', sans-serif;
font-weight: bold;
font-size: 3.0em;
color: #2caeec;
padding-left: 100px;
}
#thirdpagetitle1 {
font-family: 'Scada', sans-serif;
font-weight: bold;
font-size: 3.0em;
color: #2caeec;
}
a.navbarr:link {
display: block;
width: 122.6666666666697px;
font-weight: bold;
color: beige;
background-color: #2caeec;
text-align: center;
padding: 1px;
text-decoration: none;
text-transform: uppercase;
border: 1px outset gray;
border-radius: 5px;
} /* border optional */
a.navbarr:visited {
display: block;
width: 122.6666666666667px;
font-weight: bold;
color: beige;
background-color: #2caeec;
text-align: center;
padding: 1px;
text-decoration: none;
text-transform: uppercase;
border: 1px outset gray;
}
a.navbarr:hover {
display: block;
width: 122.6666666666667px;
font-weight: bold;
color: beige;
background-color: #b1b1b1;
text-align: center;
padding: 1px;
text-decoration: none;
text-transform: uppercase;
border: 1px outset gray;
} /* border optional */
a.navbarr:active {
background-color: #b1b1b1;
color: beige;
}
a.sitemap:link {
font-weight: bold;
color: #2caeec;
text-align: center;
padding: 1px;
text-decoration: none;
} /* border optional */
a.sitemap:visited {
font-weight: bold;
color: #2caeec;
text-align: center;
padding: 1px;
text-decoration: none;
}
a.sitemap:hover {
font-weight: bold;
color: #b1b1b1;
text-align: center;
padding: 1px;
text-decoration: none;
} /* border optional */
a.sitemap:active {
color: #b1b1b1;
}
article {
margin-bottom: 0px;
margin-top: 30px;
}
header {
padding-bottom: 0;
margin-bottom: 0;
}
footer {
background-color: #2caeec;
color: beige;
border-radius: 0 0 10px 10px;
margin-bottom: -20px;
}
.padding {
padding: 10px;
}
form {
margin-bottom: -16px;
}
fieldset {
width: 500px;
margin: auto;
}
.clearfloat {
clear: both;
}
.topround {
border-radius: 10px 10px 0px 0px;
}
p {
font-family: arial;
font-size: 1em;
padding-left: 30px;
padding-right: 30px;
margin-bottom: 20px;
}
#feedbackhead {
font-family: 'Pinyon Script', cursive;
margin: auto;
font-size: 3.0em;
color: #2caeec;
}
.fsSubmitButton {
border-top: 2px solid #a3ceda;
border-left: 2px solid #a3ceda;
border-right: 2px solid #4f6267;
border-bottom: 2px solid #4f6267;
padding: 10px 20px !important;
font-size: 14px !important;
background-color: #2caeec;
font-weight: bold;
color: beige;
cursor: pointer;
}
.fsSubmitButton:hover {
border-top: 2px solid #a3ceda;
border-left: 2px solid #a3ceda;
border-right: 2px solid #4f6267;
border-bottom: 2px solid #4f6267;
padding: 10px 20px !important;
font-size: 14px !important;
background-color: beige;
font-weight: bold;
color: #2caeec;
cursor: pointer;
}
#trophyp2 {
padding-right: 50px;
positon: absolute;
bottom: 555px;
}
#trophyp {
padding-left: 35px;
}
#trophyd {
padding-left: 25px;
}
#trophyp32 {
padding-left: 35px;
}
PS：横幅在容器边框和横幅图片之间有一个小空间，想知道如何解决这个问题？
答案 0 :(得分：0)
在HTML打开序列中修复序列，它应该是
<!doctype html>
<html lang="en">
<head>
但据我所知（而且我不是浏览器专家）实际上 是IE和border-radius。
如果你的IE实际上切换到兼容模式，你可以通过传输这个响应头来禁止它：
header('X-UA-Compatible: IE=edge');
请注意，这必须在服务器端完成，在这种情况下，META标头将无用，因为它来得太晚。