CSS - Display in one single line

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View
I've been trying to get this to work for waaaay too long.

I would like this to display this info in one line :

Like this :
HOME | BOOKMARKS (images) | SITEMAP | (search form)

PLEASE can someone tell me what I am doing wrong ?


Re: CSS - Display in one single line

writing in news:67094700-0959-4971-8a23-8b4e5b6a8885

Quoted text here. Click to load it

You would do a lot better by using list markup, and styling accordingly:

#topnavbarright {border:1px solid red;}
#topnavbarright ul {list-style-type: none;}
#topnavbarright ul li {display:inline; padding:0 1em 0 0; border-
right:1px solid #c0c0c0;}
#topnavbarright ul li.noborder
a.email : background-repeat:no-
repeat; background-postion:right; padding-right:12px}
a.external : background-
repeat:no-repeat; background-postion:right; padding-right:12px}

<div id="topnavbarright">
<li><a href="index.php">Home</a></li>
<li><a href="mailto:me@example.com" class="email" title="Grab my email
<li><a href="http://example.com " class="external" title="Visit Example">
Example Off Site Address</li>

Notes: I would not include a favorite or print icon.  People know how to
do that, and browsers do it different ways - you have no way of knowing
which browser a person is using and it could be confusing for someone if
it does not work.

I would also not include the search in the menu.  This can create issues
for those who are using a small screen.  Better to put it under the

Adrienne Boswell at Home
Arbpen Web Site Design Services
Please respond to the group so others can share

Site Timeline