Posted by Jukka K. Korpela on 07/15/07 07:44

Scripsit Paolo:

> on the top right side of my page, I've a 4 elements navigation menu
> that is css formatted [and marked up as a <ul> element ]

Well, fine, but where's the URL so that we can see the CSS code (as well as
the problem in action).

> When I resize the window in *width* (x axis) the last element is moved
> to a second row below the initial one, creating problem to the rest of
> the fluid layout.

Why would it create a problem to the rest of the fluid layout? What do _you_
mean by "fluid layout"? The way I see it, it includes the idea that the
content wraps to next line if it does not fit to the available horizontal
space.

> How can I fix that, making sure that after a certain
> point the scrollbar for the width appears allowing to scroll rather
> than sending the last element to the next row?

So you want non-fluid layout? At least in this respect. Think again. Now,
think _again_. Then reject the idea, and consider reducing the navigation
menu (it has too many items anyway), and also take the possibility of line
wrap inside it as a real possibility that _will_ materialize at times
(though not often if you make the menu reasonably small).

> In other words, how can
> I make sure the navigation menu is not broken into multiple lines when
> I resize the window?

It depends on how you have written your CSS code for formatting the menu.
However, my crystal ball says that you would need to add

ul#navmenu { white-space: nowrap; }

You might have some other id="..." value instead of "navmenu". And my
crystal ball _has_ been wrong. (I think it was in 1998.) Besides, this was a
wrong thing to want.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

[Back to original message]