Wed, 2017-02-15 23:56
How to add menu navigation to my (banner-logo-fixed menu) ?
I work in visual studio 2015 web application mvc
my design i need to do is
http://www.mediafire.com/view/8qgi42yp9glxw50/menu_under_logo.jpg
I need to add Gray menu (html && css) to (banner-logo-fixed menu)
But i face problem when add gray menu to design(banner-logo-fixed menu)
Gray menu (html && css)
html
<header class="news"> <div class="nav"> <ul> <li class="home"><a href="#">Home</a></li> <li class="tutorials"><a class="active" href="#">Tutorials</a></li> <li class="about"><a href="#">About</a></li> <li class="news"><a href="#">Newsletter</a></li> <li class="contact"><a href="#">Contact</a></li> </ul> </div> </header>
css
body { margin: 0; padding: 0; /*background: #ccc;*/ background: #ccc; } .nav ul { list-style: none; background-color: #444; /*background-color: #39bd00;*/ text-align: center; padding: 0; margin: 0; } .nav li { font-family: 'Oswald', sans-serif; font-size: 1.2em; line-height: 40px; height: 40px; border-bottom: 1px solid #888; } .nav a { text-decoration: none; color: #fff; display: block; transition: .3s background-color; } .nav a:hover { background-color: #005f5f; } .nav a.active { background-color: #fff; color: #444; cursor: default; } @media screen and (min-width: 600px) { .nav li { width: 120px; border-bottom: none; height: 50px; line-height: 50px; font-size: 1.4em; } }
(banner-logo-fixed menu) that i need to add gray menu to it .
https://jsfiddle.net/ahmedsa/3L0dpcgp/1/
How to add menu navigation to my (banner-logo-fixed menu) ?
What I try to
Add gray menu to my design but full design corrupted as my fiddle below :
https://jsfiddle.net/ahmedsa/3L0dpcgp/3/
problem happen here in fiddle