This week's book giveaway is in the Servlets forum.
We're giving away four copies of Murach's Java Servlets and JSP and have Joel Murach on-line!
See this thread for details.
The moose likes HTML, CSS and JavaScript and the fly likes wide navigation bar causes problems Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login

Win a copy of Murach's Java Servlets and JSP this week in the Servlets forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "wide navigation bar causes problems" Watch "wide navigation bar causes problems" New topic

wide navigation bar causes problems

Barry Gold

Joined: Dec 15, 2005
Posts: 22
I am writing a webpage that allows the user to navigate among categories and sub-categories of information. It consists of the following items:

1. Left side navigation (a tree-like view of the categories)
3. Top nav bar, which starts to the right of the left nav, consisting of set of top-level categories that act as drop-downs when you hover over them, allowing you to select categories within each top-level category, and sub-categories within those, etc.

This done with a series of nested <ul> and <li> elements, styled with CSS to behave the way I want. The only problem is that if the browser is narrower than the width of the left + top nav bars, the top bar moves down to the bottom of the window (below the left nav), with the actual content pushed down even further.

This problem occurs only in Internet Explorer. In Firefox, the top nav just extends off the right edge of the window, which I consider more appropriate.

Any ideas for how to fix this?

Here is a sample of the HTML code:

And here is the applicable CSS:

[ April 07, 2006: Message edited by: Barry Gold ]
Linda Walters
Ranch Hand

Joined: Apr 30, 2005
Posts: 100

Have you tried using absolute positioning for your <div> tags?
That would leave them where you put them.
Another alternative is to use frames or even iframes.

<a href="" target="_blank" rel="nofollow">Javaville Gazette</a><br />Non-cooperation with evil is a duty. -- Mahatma Gandhi
subject: wide navigation bar causes problems
Similar Threads
how would i do the following in css
Not working with MSIE7
Absolute Position in IE
Problem with struts-menu for second level submenu
CSS Footer wont stick!