css - horizontal menu, position fixed, next to div -


i have top horizontal menubar 100% width, centeraligned, fixed position, not scrolling page.

but want name (named test in example) in left side of menu, inline of menu.

but though uses inline-block, stepsdown according left sided div.

    <div class="name">test</div >  <div id="menu">          <ul>                 <li><a href="index.php?menu=1" border="0" alt="menu1">menu1</a></li>                 <li><a href="index.php?menu=1" border="0" alt="menu1">menu2</a></li>                 <li><a href="index.php?menu=1" border="0" alt="menu1">menu3</a></li>                 <li><a href="index.php?menu=1" border="0" alt="menu1">menu4</a></li>                 <li><a href="index.php?menu=1" border="0" alt="menu1">menu5</a></li>          </ul> </div> 

and css

.name { font-size: 12pt; font-weight: bold; height: 20px; color: #ffffff ; width: 99%; display:  ; position:fixed; z-index:2; padding: 5px; top: 2px; }   #menu {  background: #bbbbbb;  top: 0px;  height: 35px;  width: 99.8% ;  text-align: center ;  position:fixed;  z-index:1;  }   }  #menu ul{ display: ; height: auto; padding: 8px 0px; margin: 0px; z-index:3; }  #menu li { display: inline; z-index:3; }    #menu { display: inline-block; font-weight: bold; font-size: 15px; color: red;   text-decoration: none; vertical-align: bottom;   padding: 20px;   } 

see example: https://jsfiddle.net/sm6npxdc/3/

i reset , changed padding, height , width values. please try following css:

*{   margin: 0;     padding: 0; } .name { font-size: 12pt; font-weight: bold; height: 20px; color: #ffffff ; display:  ; position:fixed; z-index:2; padding: 5px; top: 2px; } #menu {  background: #bbbbbb;  top: 0px;  width: 99.8% ;  text-align: center ;  position:fixed;  z-index:1; } #menu ul{ display: ; height: auto; margin: 0px; z-index:3; } #menu li { display: inline; z-index:3; } #menu { display: inline-block; font-weight: bold; font-size: 15px; color: red;   text-decoration: none; vertical-align: bottom;   padding: 10px; } 

fiddle link


Comments

Popular posts from this blog

sublimetext3 - what keyboard shortcut is to comment/uncomment for this script tag in sublime -

java - No use of nillable="0" in SOAP Webservice -

ubuntu - Laravel 5.2 quickstart guide gives Not Found Error -