html5 - Navbar Menu Trouble shoot -


so wanted create fixed nav bar on top of page. instead of creating nav bar ordered list, used following approach:

<header>     <div class="nav">             <img src="images/logo_ab.png" alt="aurinbiotech logo"/>              <a href="index.html">home</a>                  <a href="#">about</a>                  <a href="#">team</a>                  <a href="#">science</a>                    <a href="#">need</a>                   <a href="#">pipeline</a>                   <a href="#">contact</a>            </div> </header> 

css:

header .nav {     margin-top:100px;     width:100%;     height:10%;     text-align:center;     padding-top:2%;     margin:0 auto;     position:fixed;     top:0;    }  header .nav {     font-size: 2em;     padding-left: 15px;     padding-right: 15px;     color:rgb(1, 1, 1);     text-decoration: none;     font-family: 'bebas'; }  header .nav a:hover  {     color:white;     background-color: #404040;     border-radius:5px;     padding:0 auto; }  header .nav a:active{     background-color: #404040;     border-radius:5px;     text-decoration:overline; }  header .nav img {     width:260px;     height:65px;     padding-right:4em; } 

the reason used approach because wanted use logo image next nav bar align in same line. problem need add sub-menus under science , pipeline heading. since didn't use ul or li, how can add sub-menus under heading.

or, can tell me other way create nav bar shows logo well. logo , menus on same line.

great in advance.

use normal ul li structure.

if set height , line-height of top level li tags equal height of image align text center of image.


Comments

Popular posts from this blog

c++ - OpenCV Error: Assertion failed <scn == 3 ::scn == 4> in unknown function, -

php - render data via PDO::FETCH_FUNC vs loop -

The canvas has been tainted by cross-origin data in chrome only -