how to "fix" elements

by skyvia
4 replies
  • WEB DESIGN
  • |
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.
#elements #fix
  • Profile picture of the author sunnykgupta
    Could I have a look at the current page?
    Signature

    ===Get One Niche Idea per week! FREE for life.===
    If you need any web application cloned with their exact financial model. Ping Me.

    {{ DiscussionBoard.errors[4123603].message }}
  • Profile picture of the author Deema
    May be you should create another class for a hover to match li hover
    {{ DiscussionBoard.errors[4124326].message }}
    • Profile picture of the author erbuc
      You could give <ul> a fixed width so that when the LI gets bigger is doesn't effect the elements outside the UL.
      {{ DiscussionBoard.errors[4128522].message }}
  • Profile picture of the author Lloyd Buchinski
    As well as specifying the upper case, you could specify a new font size for the hover state. Something like .8em maybe.
    Signature

    Do something spectacular; be fulfilled. Then you can be your own hero. Prem Rawat

    The KimW WSO

    {{ DiscussionBoard.errors[4138115].message }}

Trending Topics