Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Header configuration & styling (http://forum.bytesforall.com/forumdisplay.php?f=15)
-   -   Styling Submenu Important (http://forum.bytesforall.com/showthread.php?t=17794)

Viktoria Jun 12, 2012 03:39 AM

Styling Submenu Important
 
hello,
First of all I want to thank your forum helped me a lot.

I have a problem on my site,
how can I design a menu to show like the picture?

I managed the colors menu. But I have a problem with drop-down menu:
First drop-down menu hides the main menu, large font and colors do not match the picture I attached.
How can i design the menu like the picture?

in atahualpa I have attached the following codes CSS :
ul#rmenu2 li {
float: right;
margin-left: 14px;
border-radius: 7px;
}
and in MENU1 page menu - Border around all menu items codes:
solid 1px #ffffff;solid 0px #FDDEA9;border-radius: 7px;margin: -20px;;;;

my site: http://zerfb.com.preview8.logate.co.il/

Hope you can help me :)

juggledad Jun 12, 2012 05:27 AM

try adding
HTML Code:

div#menu1 ul.rMenu li {
    background-color: #FDDEA9;
}


Viktoria Jun 13, 2012 04:57 AM

Thanks for your response.

But the code you noted did not help me. My main problem is drop-down menu (see the attached picture in red) drop-down menu hides the main menu, and color of the menu itself does not change just the words painted.
How can I do to be exactly like the first picture?

Thank you for your help.

Viktoria Jun 13, 2012 06:55 AM

And another question, how can I in sub menu only change the text size? Like the first image?

lmilesw Jun 13, 2012 12:18 PM

Here is some CSS you can try for a start. Too time consuming to get exact code.
HTML Code:

.sub-menu {
    position: relative;
    top: 70px !important;
}
.sub-menu li {
    background: #f2adae !important;
    width: 100% !important;
}

To change the size of the top menu items you could add a class in the WordPress Menu tab (if you don't see the class selector your might have to turn it on with screen options for the menu). After setting a class just add the necessary CSS to increase the font size.

Viktoria Jun 14, 2012 02:43 AM

Thank you very much, helped me a lot!
the menu was exactly as I wanted :)

But I still did not understand how to change the size of sub menu.
Possible to add some code to CSS? I tried to put FONT-SIZE it did not work :confused:
I do not really know all of HTML codes.

juggledad Jun 14, 2012 03:58 AM

If you want to change teh sub menu items, you have to target the CSS at that level. Remember CSS stands for Cascading Style Sheet so any style you apply cascades to it's child elements. If you want them different, you need to over ride the CSS with more CSS.

The menus are the most complicated CSS with over 400 lines of CSS.

So get the extension FIREBUG for FIREFOX and examine the sub menu items to see what the CSS Selectors are that effect them. Then you can use them in the CSS Inserts to override the existing CSS applied to them.


All times are GMT -6. The time now is 01:34 PM.

Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.