Wordpress Themes - WP Forum at BFA - expand width of menu, hover help

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)

- Page & Category Menu Bars (http://forum.bytesforall.com/forumdisplay.php?f=10)

- - expand width of menu, hover help (http://forum.bytesforall.com/showthread.php?t=21185)

daisy24

Nov 24, 2013 04:21 AM

expand width of menu, hover help

Hi Juggledad,
I am a diamond member and also made a donation to you with PayPal this morning.

I am having trouble getting my menu to go across the width. I thought I followed your instructions, but must have done something wrong. I don't want borders between the items, but want a dashed border underneath.

I would also like a color change when I hover, but to go back to original color after clicking instead of staying the hover color when you're on the clicked page.

Thank you.

Daisy24
Ellen

http://www.ellifolks.com/blog/

juggledad

Nov 24, 2013 04:55 AM

Quote:

I would also like a color change when I hover, but to go back to original color after clicking instead of staying the hover color when you're on the clicked page.

go to ago->MENU 1 (Page Menu) and set
Background color
Background color: Hover
Background color: Parent
all to the same value (FFFFFF = white)
go to ago->Add HTML/CSS Inserts->CSS Inserts and add the following

HTML Code:

/* "current" page and hover */

div#menu1 ul.rMenu li.current-menu-item > a:hover, 

div#menu1 ul.rMenu li.current_page_item > a:hover,

div#menu1 ul.rMenu li.current-menu-item a:hover, 

div#menu1 ul.rMenu li.current_page_item a:hover, 

div#menu1 ul.rMenu li a:hover {

        background-color: #00ffff;

        }

you may want to change the 00ffff to some other color.

to get the menu items spaced evenly try this add to the CSS Inserts

HTML Code:

div#menu1 ul.rMenu li {

    margin-left: 178px;

}

li#menu-item-3206 {

    margin-left: 0 !important;

}

daisy24

Nov 24, 2013 07:58 AM

Hi Juggledad,

Thank you for your help!

I have the menu set so the background doesn't change when hovering or clicking. I meant for the menu text I would like the color to change only when hovering, not when clicked on the page. Sorry I didn't explain clearly.

The menu is now going across the width, but the line under it has breaks where the words are. Is there a way to have the line go across with no breaks? I also didn't want a line above or any vertical border. Is there a way to do this?

Thank you!:)

Daisy24

http://www.ellifolks.com/blog/

juggledad

Nov 24, 2013 10:32 AM

change the 'background-color' to 'color'

to get rid of the dashes add

HTML Code:

div#menu1 {

        border: none;

}

daisy24

Nov 30, 2013 05:50 AM

still have breaks in menu bar & clicked page menu items still stay hover color

Hi Juggledad,

I think I did as you suggested for fixing the breaks in the line under the menu and having menu hover color go back to normal state after clicking, but it is still the same. It's very possible I did something incorrectly or misunderstood exactly what to do. Any help would be greatly appreciated.

Thank you. :)
Daisy24

http://www.ellifolks.com/blog/

juggledad

Nov 30, 2013 10:36 AM

I don't see the frirst part of the code I gave you in post #2 in your code. Did you remove it?
(P.S. don't open new threads for a continuing issue.

daisy24

Nov 30, 2013 03:09 PM

Hi Juggledad,

Sorry, I wasn't sure where to post.

Is this the code you mean? I did take it out because it deleted the whole line under the menu items. What I was trying to do was to get rid of the breaks in the line that are under the words of the menu items. With it out, I did have my dashed line that I wanted, but it still had the breaks in it.

div#menu1 {
border: none;
}

Thank you.

Daisy24

juggledad

Nov 30, 2013 06:23 PM

Well it looks like you decided to remove the menu altogether. So should I consider this issue resolved?

daisy24

Dec 1, 2013 02:56 AM

The menu should be back up. I activated an old version of the theme by mistake and it didn't have the menus. It took me a while to figure out what happened.

I put the code back in and the line under the menu has disappeared.

Daisy24

juggledad

Dec 1, 2013 03:29 AM

It is helpful to be clear on what you are trying to do, only discuess one issue at a time and not be changing the site while waitig for help - not doing that results in the volunteer moderators wasting their time. A point to keep in mind.

There is a border that goes around all the menu items. It is also possible to underline text anywhere on the site using the 'text-decoration: underline;' CSS rule. Using FireBug you could have found that this CSS will work to underline the menu items:

HTML Code:

div#menu1 ul.rMenu li a:link, div#menu1 ul.rMenu li a:hover, div#menu1 ul.rMenu li a:visited, div#menu1 ul.rMenu li a:active {

     text-decoration: underline;

}

All times are GMT -6. The time now is 10:27 AM.