Jump to content

Archived

This topic is now archived and is closed to further replies.

The Tennis Chick

Vertical lines in a drop down menu

Recommended Posts

The Tennis Chick

Hi y'all :-)

 

It's been a while but I'm back with another question...

 

I added vertical lines to my drop down menu, and though I removed the line from the last tab, they still show up on all the drop down tabs.

 

This is the code I used:

 

 
ul.sf-menu li a:after {
content: "|";
font-size: 25px;
padding-left: 8px;
padding-right: 0;
}
 
ul.sf-menu li:last-child a:after {
    content: "  " !important;
}
 
What else do I need to do to remove the lines from the drop down items without removing them from the whole menu?
 
Thanks in advance :-)
 
Jen

 

Share this post


Link to post
Share on other sites
Danny

Hi Jen,

 

In my opinion, you have gone about adding those vertical lines in the wrong way. If I was to do it, I would have added the CSS border-right: 2px solid black to the main navs li class instead.

 

I would recommend removing the code you have and using my suggestion and see how that works.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
The Tennis Chick

Hi Danny :-)

 

Thanks for the quick reply :-) That looks so much better than what I had. You can tell by my odd coding that I'm absolutely winging it, lol! I still can't get the border off the last menu item, or off the drop down menu items though. Do I have to do it item by item, or is there a way to do all links at once? Also, I notice that now my drop down links are difficult to access. They show up, but you have to be very, very quick to move your mouse over it or they'll disappear. See what I mean:

 

http://www.cheekychickblog.com

Share this post


Link to post
Share on other sites
Danny

Add the following to your custom CSS:

 

#site .main_nav li:last-child {
  border-right: none;
}
 
You can learn more about the :last-child and other pseudo classes here - http://css-tricks.com/pseudo-class-selectors/

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
The Tennis Chick

Thanks Danny :-)

 

That worked like a charm, and I got the rest of the borders off, but I still have the problem that the drop downs disappear when hovering. I don't know why it's now happening, nor how to fix it

 

 

Share this post


Link to post
Share on other sites
Danny

I have just viewed your site and your dropdowns are working as intended ?


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
The Tennis Chick
Hmmmm... I just got a new computer that uses Windows 8. I wonder if that has something to do with it?

Share this post


Link to post
Share on other sites
Danny

Can you provide a video of the issue please, we recommend Jing.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

×