Thomas Peklak wrote:

>>[Quoting francky:] Indeed, now I read this, I should have said: "No more 
>>problem?" instead
>>of "No more problem!". Thanks for correcting!
>>I tried the "really dynamic stretching of individual elements" in a 2nd
>>testpage
>><http://home.tiscali.nl/developerscorner/css-discuss/liquidfish2.htm>.
>>    
>>
>Sorry, but i can not see it work correctly in this page.
>You only see a hover effect in IE when you are directly over the text
>of a sub menu. When you move the cursor to the right, where there is
>no text, there is no hover-effect. In FireFox there is and it is click
>able. (try out "svg andso/Interactive with the mouse" there is lots of
>space to the right)
>
>The only thing i can think of is to find out the width of the <ul>
>with java script and set the width of the <a>, so that it fits exactly
>into it. But i hoped that i would not have to use java script for
>this.
>
>greets,
>   thomas
>
You are right, Thomas. In my testpage I was focused on omitting every width.
Was thinking also direction js: count the # of letters of a list-item, 
then translating that in an em-factor for the individual width. Hm.

But when you have only 1 set of nested submenus, you can omit the width 
for the menu-items, and give a (relative) width back to the 
submenu-items. I thought that would cause not to much harm, for the 
submenu's are vertical and not screenfilling. Tried that in another 
testpage, and o yes, a new problem: if you have a small menu-item on the 
right side of the screen, then the submenu will go out of screen. A 
scrollbar l-r comes up, but trying to get there will loose focus on the 
subitem, and gone is the scrollbar ... More or less you can scroll l-r 
with the arrow keys, but that's not userfriendly at all...

Then I tried some other options, in order to avoid javascript. Placing 
an invisible image with float:right - no, covers the whole screen (as 
could be expected). And so on, I'll not disturb you with the failures!
It seemed the only thing without javascript was to fill up the empty 
blockspace in IE with a lot of &nbsp;'s. Condition is that you know 
before what is the maximum width of the longest item of a submenu, so 
you can adapt the rest. And you have to do it by hand - not a beauty.
Next step: make a span inside the li (at the end of the link) with a 
given width in em = also to do by hand with trial and error.
Then all of a sudden I saw that if I gave only one li a width as above, 
all the other li's of that ul were going o.k. in IE without doing anything!

Aha: light shining! Time for developing an IE-hack. I came to an 
invisible first li with a certain width (no heights etc.), abandoned to 
{margin-left:-9999px}.
This is the result: 
http://home.tiscali.nl/developerscorner/css-discuss/liquidfish3.htm. FF 
and IE seem to do what I wanted. :-)
But I'm sure the will be always something to solve - don't know what it 
is yet.
O, I see one: Opera gives the submenu's a max-width of the menu-item 
above - but still working.
And of course the no-style option gives empty first sublist items; 
perhaps that can be solved with an @media rule.

Anyway, this one can do it without javascript.
francky
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to