html - top-menu-navigation in css isn't working here, what's wrong with it? -
top-menu-navigation in css isn't working here, what's wrong it? code is:
/*variables*/ @link-color: "#000000"; @text-color: "#5b5b5b"; @light-text-color:"c9c9c9"; @heading-font: "bree serif"; @body-font: "arial"; body{ background: transparent url('images/bg.jpg')0 0 repeat; } ul{ margin-bottom: 1.5em; } .main-header{ background: white; border-bottom: 1 px solid @boarder color; } .top-menu-container{ background: black; .top-menu-navigation ul { >li { float: left; a{ color: green; } } } }
html code is"
<header class = "main-header" id="top"> <div class = "top-menu-container"> <div class = "container"> <nav class = "top-menu-navigation clearfix"> <ul> <li><a href="">top link 1</a></li> <li><a href="">top link 3</a></li> </ul> </nav> <!--end navigation--> </div> <!--end container--> </div> <!--end top-menu-container--> </header>
hi new in field , in learning phase. can't figure out error in sub class of top-menu-mavigation. thanks
you have not closed header tag , css not formed. check example: http://jsfiddle.net/jtorrescr/f5mwa/
html
<header class = "main-header" id="top"> <div class = "top-menu-container"> <div class = "container"> <nav class = "top-menu-navigation clearfix"> <ul> <li><a href="">top link 1</a></li> <li><a href="">top link 3</a></li> </ul> </nav> <!--end navigation--> </div> <!--end container--> </div> <!--end top-menu-container--> </header> css /*variables*/ @link-color: "#000000"; @text-color: "#5b5b5b"; @light-text-color:"c9c9c9"; @heading-font: "bree serif"; @body-font: "arial"; body { background: transparent url('images/bg.jpg')0 0 repeat; } ul { margin-bottom: 1.5em; } .main-header { background: white; border-bottom: 1 px solid @boarder color; } .top-menu-container { background: black; } .top-menu-navigation ul>li { float: left; } { color: green; }
Comments
Post a Comment