code css3 won't be seen

bleured27 · July 19, 2012

got a problem whith i use css3

did i included the file right ?

<html>
<head>
<link href="css.css" rel="stylesheet"  type="text/css">
<title>
tietel
</title>
</head>
<body><ul class="menu"><li><a href="#">gm controll</a><ul><li><a href="#" class="bann">bann</a></li></li>
<li><a href="#" class="masamessages">masa Messages</a></li><li><a href="#" class="gogame">go game</a></li></ul></li><li><a href="#">events</a><ul><li><a href="#" class="creteevents">create event</a></li><li><a href="#" class="stopevents">stop event</a></li></li></ul></li><li><a href="#">support</a></li>
<li><a href="#">contact</a></li>
<li><a href="#">log out</a></li>
</ul>
</body>
</html>


.menu,
.menu ul,
.menu li,
.menu a {
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
}
 
.menu {
    height: 40px;
    width: 505px;
 
    background: #4c4e5a;
    background: -webkit-linear-gradient(top, #4c4e5a 0%,#2c2d33 100%);
    background: -moz-linear-gradient(top, #4c4e5a 0%,#2c2d33 100%);
    background: -o-linear-gradient(top, #4c4e5a 0%,#2c2d33 100%);
    background: -ms-linear-gradient(top, #4c4e5a 0%,#2c2d33 100%);
    background: linear-gradient(top, #4c4e5a 0%,#2c2d33 100%);
 
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
 
.menu li {
    position: relative;
    list-style: none;
    float: left;
    display: block;
    height: 40px;
}


.menu li a {
    display: block;
    padding: 0 14px;
    margin: 6px 0;
    line-height: 28px;
    text-decoration: none;

    border-left: 1px solid #393942;
    border-right: 1px solid #4f5058;

    font-family: Helvetica, Arial, sans-serif;
    font-weight: bold;
    font-size: 13px;

    color: #f3f3f3;
    text-shadow: 1px 1px 1px rgba(0,0,0,.6);

    -webkit-transition: color .2s ease-in-out;
    -moz-transition: color .2s ease-in-out;
    -o-transition: color .2s ease-in-out;
    -ms-transition: color .2s ease-in-out;
    transition: color .2s ease-in-out;
}

.menu li:first-child a { border-left: none; }
.menu li:last-child a{ border-right: none; }

.menu li:hover > a { color: #8fde62; }
.menu ul {
    position: absolute;
    top: 40px;
    left: 0;

    opacity: 0;
    background: #1f2024;

    -webkit-border-radius: 0 0 5px 5px;
    -moz-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;

    -webkit-transition: opacity .25s ease .1s;
    -moz-transition: opacity .25s ease .1s;
    -o-transition: opacity .25s ease .1s;
    -ms-transition: opacity .25s ease .1s;
    transition: opacity .25s ease .1s;
}

.menu li:hover > ul { opacity: 1; }

.menu ul li {
    height: 0;
    overflow: hidden;
    padding: 0;

    -webkit-transition: height .25s ease .1s;
    -moz-transition: height .25s ease .1s;
    -o-transition: height .25s ease .1s;
    -ms-transition: height .25s ease .1s;
    transition: height .25s ease .1s;
}

.menu li:hover > ul li {
    height: 36px;
    overflow: visible;
    padding: 0;
}

.menu ul li a {
    width: 100px;
    padding: 4px 0 4px 40px;
    margin: 0;

    border: none;
    border-bottom: 1px solid #353539;
}

.menu ul li:last-child a { border: none; }

mikhl · July 20, 2012

Try:

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

Also ensure you are using the right href path. So if the CSS.css file is in a CSS directory you may need to use ../css.css

Sign In

code css3 won't be seen

Recommended Posts

bleured27

Link to comment

Share on other sites

mikhl

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information