How to put lines just on right an left side of active Menu Items
Here's what the page menu buttons look on my site:
http://synchronicitysandbox.com/ there's a 1px line just on the right and left side of the active button. Here's how to do it in Atahualpa: In the style.css find this: /* "current" page and hover */ ul.rMenu li.current_page_item a:link, ul.rMenu li.current_page_item a:active, ul.rMenu li.current_page_item a:hover, ul.rMenu li.current_page_item a:visited, ul.rMenu li a:hover and add this: { background-color:#FFFFFF; border-left:1px solid #000000; border-right:1px solid #000000; /* more ... */ border-bottom:1px solid #fff; border-top:1px solid #fff; font-weight:bold; padding: 4px 5px; } What you've done is added a 1px border to your button, and that's a problem because when someone scrolls over the buttons, they'll jump around. So, if you don't like that, you've got to add borders to a few other areas. so add this: border:1px solid #FFFFFF; to these sections, like this: ul.rMenu li a { padding: 4px 5px; border:1px solid #FFFFFF; } /* added for dark menu*/ ul#rmenu li a { padding: 4px 5px; border:1px solid #FFFFFF; } ul.rMenu li a:link, ul.rMenu li a:hover, ul.rMenu li a:visited, ul.rMenu li a:active { text-decoration: none; /* more ... */ margin:0; padding: 4px 5px; border:1px solid #FFFFFF; } /*added*/ ul#rmenu li a:link, ul#rmenu li a:hover, ul#rmenu li a:visited, ul#rmenu li a:active { text-decoration: none; /* more ... */ margin:0; padding: 4px 5px; border:1px solid #FFFFFF; } /* ul.rMenu li.sfhover a:active, ul.rMenu li:hover a:active { color: #fff; background-color: #c00; border:1px solid #FFFFFF; } */ Then go into your wp Atahualpa editor, and change the colors around of your hover and active menu items under 'page menu bars', so that they'll be white (#FFFFFF). Hope it works for you, too. |
Note:
The height of the lines seemed a bit much, so I decreased the height, and increased the padding to the right and left, this way: padding: 2px 8px; instead of: padding: 4px 5px; |
All times are GMT -6. The time now is 07:47 AM. |
Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.