javascript - creates a line break before and after drop down menu in css -
when created drop down menu using css, generates line break before , after drop down menu here html code
<body> <!--nav class="navi"--> <div class="navi" id="navi"> <ul> <li><a href="#">home</a></li> <li><a href="#">about us</a> <ul> <li><a href="#">history</a></li> <li><a href="#">company profile</a></li> <li><a href="#">core values , mission</a></li> <li><a href="#">strategy</a></li> </ul> </li> <li><a href="#">our brands</a> <ul> <li><a href="#">hamara glucose d</a></li> <li><a href="#">hamara health care patent products</a></li> <li><a href="#">waht's new</a></li> </ul> </li> <li><a href="#">nutrition space</a> <ul> <li><a href="#">product faq</a></li> <li><a href="#">health & wellness</a></li> </ul> </li> <li><a href="#">media</a> <ul> <li><a href="#">news paper clippings</a></li> <li><a href="#">product photos</a></li> <li><a href="#">founder which...</a></li> </ul> </li> <li><a href="#">hss</a></li> <li><a href="#">copackers & investors</a></li> <li><a href="#">career</a></li> <li><a href="#">communities</a></li> <li><a href="#">contact us</a></li> </ul> </div> <!--/nav--> </body>
and here css code
<style> .navi ul li { float:left; } .navi ul li { display:block; padding: 10px; text-decoration:none; } .navi ul li:hover > { color:white; } .navi ul { display:inline-table; list-style:none; padding: 0 0px; position:relative; background:#c93; } .navi ul ul { display: none; position:absolute; } .navi ul ul li { /*display:block;*/ float:none; } .navi ul li:hover > ul { display:block; background:#fc0707; } </style>
so don't want generate line break
*{ padding:0; margin:0; }
add styles
Comments
Post a Comment