Welcome to WebmasterWorld Guest from 54.163.94.5

Forum Moderators: not2easy

Message Too Old, No Replies

how to "fix" elements

     
11:54 pm on Mar 9, 2010 (gmt 0)

Junior Member

5+ Year Member

joined:May 16, 2009
posts: 86
votes: 0


Hello,
I have a <ul> with <li> and <a> in those <li>

When I -hover- on -li a- I want to transform the text of -a- to uppercase, this causes the elements on the right of the li to slide forward because of the bigger size.
Is there a way to fix the element when I hover on it so the elements nearby won't be affected? The only thing I thought is to use absolute rule for every li but this would be impossible because this menu is generated dynamically and changes every time.
1:03 am on Mar 10, 2010 (gmt 0)

Senior Member

WebmasterWorld Senior Member g1smd is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:July 3, 2002
posts:18903
votes: 0


As you make the text bigger, also change the padding and/or margin to a smaller value to compensate?
4:03 pm on Mar 10, 2010 (gmt 0)

Junior Member

5+ Year Member

joined:May 16, 2009
posts:86
votes: 0


the problem with that is that the margin is not the same for every element
1:59 pm on Mar 11, 2010 (gmt 0)

Full Member

5+ Year Member

joined:Mar 3, 2009
posts: 227
votes: 0


Well you could always set all the li's to have the same fixed width. Wide enough to where the longest a text, when hovered, doesn't effect the rest of the content.
3:30 pm on Mar 11, 2010 (gmt 0)

Junior Member

5+ Year Member

joined:May 16, 2009
posts:86
votes: 0


that could do it, i'll let you know