BrutallyHonest
New Member
I have a navbar on the top of my html site. I recently wanted to change it so that the bar will always show on the page as the user scrolls down. I ran into a problem when doing this. For some reason, it takes the list and stacks it vertically when initially it is horizontally. I have been trying to find a solution for this but I am stuck. Here is what it looks like: I can not figure out how to keep the list horizontal, All help is greatly appreciated!\[code\] <table> <!-- first row --> <tr> <!-- first column --> <td colspan="2" style="position: fixed; top: 0px; right: 50%"> <div class="navbar" style="text-align: center; margin: 0 auto;"> <div class="navbar-inner"> <div class="brand"> <a href="http://stackoverflow.com/questions/15515732/www.investorsfortunes.com"> Investorsfortunes.com </a> </div><ul class="nav"> <li class="divider-vertical"><a href="http://stackoverflow.com/questions/15515732/#">Investors</a></li> <li class="divider-vertical"><a href="http://stackoverflow.com/questions/15515732/#">Deals</a></li> <li class="divider-vertical"><a href="http://stackoverflow.com/questions/15515732/#">Attornies</a></li> <li class="divider-vertical"><a href="http://stackoverflow.com/questions/15515732/#">Appraisers</a></li> <li class="divider-vertical"><a href="http://stackoverflow.com/questions/15515732/#">Contact Us</a></li> <li class="login"> <button class="btn btn-primary" id="loginBtn" >Login</button> </li> <li class="login"> <button class="btn btn-primary" id="loginBtn" >Sign-Up</button> </li> </ul> </div> </div> </td> <!-- second column --> <td> </td> <!-- third column --> <td> </td> </tr> </table>\[/code\]