Help with text displayed not where I need it.

[Darkmatter5]

Here's my CSS

#navcontainer ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
#navcontainer ul li {
    display: inline;
}
#navcontainer ul li a {
    text-decoration: none;
    padding: .2em 1em;
    color: #fff;
    background-color: #036;
}
#navcontainer ul li a:hover {
    color: #fff;
    background-color: #369;
}

 

Here's the HTML

<div id="navcontainer">
  <ul id='navlist'>
    <li><a href='index.php' id='current'>Home</a></li>
    <li><a href='help.php'>Help</a></li>
    <li><a href='world.php'>World view</a></li>
    <li><a href='res_section.php'>Holding view</a></li>
    <li><a href='res_settlement.php'>Settlement view</a></li>
  </ul>
</div>

 

I'm wanting to put some text in that will be displayed inline with the list code, but be pushed all the way to the right of the window.

 

If I use this:

<div id="navcontainer">
  <ul id='navlist'>
    <li><a href='index.php' id='current'>Home</a></li>
    <li><a href='help.php'>Help</a></li>
    <li><a href='world.php'>World view</a></li>
    <li><a href='res_section.php'>Holding view</a></li>
    <li><a href='res_settlement.php'>Settlement view</a></li>
  </ul>
  <span style='position: absolute; right: 0;'>text</span>
</div>

 

It displays text below the list and all the way to the right, but not inline.

[dropfaith]

you want it inline and you want the ul inline why not just nest is inside of a ul?

 

would be the easy way  otherwise

 

<div id="navcontainer" style="float:left;">
  <ul id='navlist'>
    <li><a href='index.php' id='current'>Home</a></li>
    <li><a href='help.php'>Help</a></li>
    <li><a href='world.php'>World view</a></li>
    <li><a href='res_section.php'>Holding view</a></li>
    <li><a href='res_settlement.php'>Settlement view</a></li>
  </ul>

</div>
<div style="float:right;">text
</div>

 

and set widths to those divs based on your styling