horizontal menu, position fixed, next to div

Question

I have a top horizontal menubar 100% width, centeraligned, with fixed position, so its not scrolling with the page.

But I also want a name (named test in example) in the left side of the menu, inline of the menu.

But even though I uses inline-block, it stepsdown according to the 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 a {
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/

Answer 1

I reset and changed some padding, height and width values. Please try the 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 a {
display: inline-block;
font-weight: bold;
font-size: 15px;
color: red;  
text-decoration: none;
vertical-align: bottom;  
padding: 10px;
}

fiddle link