垂直导航CSS无法在IE中工作

时间:2015-02-24 15:06:10

标签: html5 css3 internet-explorer

我正在设计一个网站,除IE之外,它适用于所有浏览器。除了大小和位置之外,所有CSS都在工作。

<!DOCTYPE html>

<html lang="en">
<head>
   <meta charset="utf-8">
   <link rel="stylesheet" type="text/css" href="Bizzy.css">
</head>

<title>Bizzy Bees Port Talbot</title>

</head>

<body>

<header>
    <h1><center>Bizzy Bees </center> </h1>
</header>

    <h2> <font color="#27B9F7"> blue </color> </h2>

<!--------------
Navigation
---------------->

<nav>
    <ul>
    <li><a href="Menu.html">Menu</a></li>
    <li><a href="Parties.html">Parties</a></li>
    <li><a href="Events.html">Events</a></li>
    <li><a href="Gallery.html">Gallery</a></li>
    <li><a href="About.html">About Us</a></li>
    <li><a href="Contact.html">Contact Us</a></li>       
    </ul>
</nav>

<!----------
Navigation End
------------>

<!----------
Information div
----------->

<DIV id= "info">
    Text Goes Here
</DIV>

</body>
</html>


/* Bizzy Bees CSS */

body {
    background-image: url("http://www.clker.com/cliparts/a/o/t/V/i/n  /trees-sky-grass.svg"); 
background-size: cover; 
font-family: "Comic Sans MS", "Comic Sans";
}

h2 {
text-align:center;
}

ul{
list-style-type: none;
display: block;
} 

/* unvisited link */
a:link {
color: #000;
text-decoration:none;
}

/* visited link */
a:visited {
color: black;
text-decoration:none;
}

/* mouse over link */
a:hover {
color: yellow;
text-decoration:none;
}

ul li{ 
border-style: dotted;
border-color:yellow;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
width: 120;
background-color: #cc9900;
padding-top: 7;
padding-bottom: 8;
padding-left:3;
padding-right:3;
margin: 0.5em;
text-align: center;
position:relative;
top:50;
font-size:20;
underline-style: none;
}

#info{
Border: 2px solid black;
background-color:#cc9900;
width: 200px;
margin-left: auto;
margin-right: auto;
margin-top: -160px;
color:black;
}

我需要网站与所有浏览器兼容,所以任何有助于向我展示我出错的地方都会非常感激。

0 个答案:

没有答案