6 replies [Last post]
deronsizemore
deronsizemore's picture
Offline
Enthusiast
Last seen: 11 years 10 weeks ago
Timezone: GMT-5
Joined: 2007-01-18
Posts: 113
Points: 14

Hi - I've done some more work on the site I posted in my last post here. Now I've ran into another small problem that I can't seem to shake. I've got a nav menu (tabs) which I've floated right but since I've floated it right the list items are backward. The "HOME" tab is one the right instead of the left where I would expect it to be. I know it's because of the float: right, I just don't know how to change it. My nav menu's are normally on the left hand side so I've never encountered this before.

http://www.oxtalk.com/ksba

Thanks

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 8 years 33 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

When you float something

When you float something right it goes as far right as it can. So the first one will go to the right hand edge. Then next one will abutt the left edge of that item - ie, source order will be right to left order, or to put it another way from left to right they will be in reverse order.

You can fix it by reversing the source order.

Ed Seedhouse
Ed Seedhouse's picture
Offline
Guru
Victoria British Columbia
Last seen: 11 weeks 6 days ago
Victoria British Columbia
Timezone: GMT-8
Joined: 2005-12-14
Posts: 3570
Points: 675

deronsizemore wrote:I've got

deronsizemore wrote:
I've got a nav menu (tabs) which I've floated right but since I've floated it right the list items are backward.

Which is how the CSS standard says it should be. Just as with a left float the first item in the list will float as far to the left as it possible, so with a float right the first item in the list must float to the right as far as possible.

Ed Seedhouse

Posting Guidelines

Watch out! I am carrying irony, sarcasm and satire, and know how to use them.

deronsizemore
deronsizemore's picture
Offline
Enthusiast
Last seen: 11 years 10 weeks ago
Timezone: GMT-5
Joined: 2007-01-18
Posts: 113
Points: 14

Thank you for the responses.

Thank you for the responses. I figured there was some easy CSS style I could throw in there to make the first list item appear back on the left. No big deal though, I will just reverse the HTML. Smile

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 7 years 10 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

You could try floating the

You could try floating the li left (or display: inline) and the float the ul right

deronsizemore
deronsizemore's picture
Offline
Enthusiast
Last seen: 11 years 10 weeks ago
Timezone: GMT-5
Joined: 2007-01-18
Posts: 113
Points: 14

wolfcry911 wrote:You could

wolfcry911 wrote:
You could try floating the li left (or display: inline) and the float the ul right

I had tried originally floating the li left and the ul right (didn't work - it just places the nav back on the left hand side). I had not tried display: inline, but that also didn't work. I switched the HTML around around and it's fine.

I appreciate the help! Smile

deronsizemore
deronsizemore's picture
Offline
Enthusiast
Last seen: 11 years 10 weeks ago
Timezone: GMT-5
Joined: 2007-01-18
Posts: 113
Points: 14

Wolfcry. After some code

Wolfcry. After some code tweaking, floating the url right and then floating the li left actually did work.

Thanks.