Skip to main content
Topic: Jumpy second and third level links in droppys. (Read 6086 times) previous topic - next topic
0 Members and 1 Guest are viewing this topic.

Jumpy second and third level links in droppys.

Groovy borders on hover, but you missed the trick to stop them jumping.


The old code included a transparent 1px solid border around the links off hover. There was a reason for that. It stops the links jumping around by 1px when you apply the visible, coloured border on hover.


This is the best way to do such links: apply a see-through border all the time, and just change the colour and/or opacity on hover.

Here endeth teh lesson. :)
Master of Expletives: Now with improved family f@&king friendliness! :D

Sources code: making easy front end changes difficult since 1873. :P

Re: Jumpy second and third level links in droppys.

Reply #1

 Arantor misses the like button

Re: Jumpy second and third level links in droppys.

Reply #2

 Antechinus doesn't much like Like buttons........
Master of Expletives: Now with improved family f@&king friendliness! :D

Sources code: making easy front end changes difficult since 1873. :P

Re: Jumpy second and third level links in droppys.

Reply #3

A a slight box-shadow might look nicer, and won't make things jump around.
~((0040 + 0x20) + (0b111 << 1))
"You never said something, for me, to penny mention work a barbecue pit." ~ Gilligan

Re: Jumpy second and third level links in droppys.

Reply #4

The theme (and variants) are still considered WIP, but thanks for reporting  :)
 TE misses a :thumbsup: smiley

Wanna fix it yourself?  :D  I know you hate github but it's not that complicated with Netbeans IDE..  I'm planning some docs with screenshots and the whole process is mostly GUI based.
Thorsten "TE" Eurich
------------------------

Re: Jumpy second and third level links in droppys.

Reply #5

No. :P
Master of Expletives: Now with improved family f@&king friendliness! :D

Sources code: making easy front end changes difficult since 1873. :P

Re: Jumpy second and third level links in droppys.

Reply #6

https://github.com/elkarte/Elkarte/issues/490

Fixed
Bugs creator.
Features destroyer.
Template killer.

Re: Jumpy second and third level links in droppys.

Reply #7

Hey I had a better idea about this. I'm going to declare box-sizing: border-box on all menu links. That will be less for n00bz to worry about.

I know the default transparent border is in the repo stuffz already, but that depends on teh noobz wanting the same size border all round, and on them remembering to change the fallback transparent border width if they're getting fancy, n stuff. IOW, someone, sometime, is going to drive themeselves nuts with it.

If we just make them all border-box, any and all borders will automatically fit within the anchor's limits, so it's more idiot-proof. This is good. :)
Master of Expletives: Now with improved family f@&king friendliness! :D

Sources code: making easy front end changes difficult since 1873. :P