- This topic is empty.
June 2, 2015 at 2:20 pm #203116
Hi, I’m working on a drop down menu based on a nice design I found here, but I have made numerous edits. I’d specifically like to get the Parent UL LI to turn back to white while I’m hovering over the Child UL LI (the UL UL LI), but I’m stumped. Any suggestions? I also had to “force” some styling with a few !important tags — I’d love to get rid of them.June 2, 2015 at 2:40 pm #203117
If you make a Codepen.io demo we can take a look.June 3, 2015 at 7:04 am #203145June 3, 2015 at 7:11 am #203146
Firstly, there is no selector that will change the styles of a parent based on a child.
So…my first thought is to switch the background changes to the links…rather than the list item that wraps the link.June 3, 2015 at 7:53 am #203148
Thanks! That solved the immediate problem. Any thoughts on eliminating the !important declarations?June 3, 2015 at 7:56 am #203149
Figure out why you used them in the first place.
It’s usually because you have specificity problems…a declaration further up (usually) is too broad and so you need to narrow it down by making it more specific to target only the elements you want.
http://code.tutsplus.com/tutorials/the-30-css-selectors-you-must-memorize–net-16048June 4, 2015 at 7:38 am #203194
Thanks again for the great advice. I little reordering on the declarations allowed me to eliminate the !important tags.
Now, I thought it’d be fun to add a transition effect to the drop down on hover. I tried to add a transition declaration, but it only had an effect on colors — any suggestions on how to get the drop down to expand and collapse up and down on hover?June 4, 2015 at 8:07 am #203195
You’re using the
displayproperty to hide/show the submenus and that can’t be animated.
I’m not saying it can’t be done with CSS but probably not with what you have there without a great deal of re-tooling.June 4, 2015 at 8:21 am #203198
I think it’s possible because I found this.
Just need to figure out how to strip the css and move into my menu
If the whole menu has to be reworked then so be it, any suggestions are greatly appreciated.June 4, 2015 at 9:18 am #203205
That link doesn’t work for me at all.June 4, 2015 at 9:33 am #203209
It should work, maybe try it again : )
- The forum ‘CSS’ is closed to new topics and replies.