Hi,

let me show you my code first:

<div id="container">
   <div id="header"></div>
   <div id="headlines">
      (irrelevant)
   </div>
   <div id="left">
      <div id="menu_0" class="menu">
         <div>some text</div>
         <div>some text</div>
         <div>some text</div>
         (and so on)
      </div>
      <div id="menu_1" class="menu">
         (as above)
      </div>
      (and a few more menu_X divs)
   </div>
</div>

#container {
   margin-left: auto;
   margin-right: auto;
   width: 986px;
}
#header {
   width: 986px;
   height: 100px;
}
#headlines {
   width: 395px;
   height: 20px;
   float: left;
   overflow: hidden;
   position: relative;
   padding-left: 5px;
}
#menu {
   width: 586px;
   height: 20px;
   float: left;
   overflow: hidden;
}
.menu {
   display: none;
   position: relative;
}
#menu_0 {
   display: block;
}
.menu div {
   height: 20px;
   padding-left: 5px;
   padding-right: 5px;
   float: left;
}

Now, the total width of the left-floating descendants of #menu_0 is
greater than the width of #menu (that is 586px), so not all the
descendants fit within those 586px.

In Firefox, Konqueror, Opera and IE the descendants that don't fit in
586px are wrapped and placed in another line.

What I need is all the descendants to be placed in one line and when
there are descendants that don't fit in the available 586px, I want
them to be in the same, one line anyway, just not visible.

I have made a simple workaround - added "width: 10000px;" to the .menu
class. Unfortunatelly that did the trick only for Firefox, Konqueror
and Opera. In IE all the descendants are placed in one line as well
but instead of hiding the descendats that don't fit in 586px IE shows
them all, those that do not fit in 586px are displayed outside #menu
and #container, extending width of the page (a horizontal scrollbar
appears).

I hope I have explained my problem clearly. If you have additional
questions, I'll be happy to provide more information, just please help
me solve this issue.

Thanks,

Alex
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to