Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Page & Category Menu Bars »

How to vertically center-align one-line and two-line menu labels?


 
Prev Previous Post   Next Post Next
  #1  
Old Mar 11, 2013, 11:37 PM
steve955
 
11 posts · Nov 2010
New York
How to vertically center-align one-line and two-line menu labels?

I encountered a situation for top page menu in Atahualpa:

The top page menu has six menu items (each has own drop-down menu). Of the six menu labels, two are very long and I have to break them into two lines. Now all the labels are vertically top-aligned, is there a way to make them center-aligned using HTML/CSS inserts? Need expert's help! sandbox site: http:---------------

We tried many approaches without success, current HTML/CSS inserts:

/* ======================= */
/* top level menu items */
/* ======================= */
div#menu1 ul.rMenu-hor li.rMenu-expand a,
div#menu1 ul.rMenu li a,
div#menu1 ul.rMenu li.rMenu-expand a {
background: none;
height: 55px;
line-height: 16px;
padding: 0;
margin: 0;
}

div#menu1 ul.rMenu li.rMenu-expand li a,
div#menu1 ul.rMenu li.rMenu-expand li li a,
div#menu1 ul.rMenu li.rMenu-expand li li li a {
height: auto;
}

div#menu1 ul.rMenu-hor li.rMenu-expand a span,
div#menu1 ul.rMenu li a span,
div#menu1 ul.rMenu li.rMenu-expand a span {
padding: 10px 24px 8px 11px !important;
margin: 0;
display: block;
}

div#menu1 ul.rMenu-hor li.rMenu-expand a { padding: 0 !important; }

div#menu1 ul.rMenu li.current_page_item,
div#menu1 ul.rMenu li.current_page_item a,
div#menu1 ul.rMenu li.current-menu-item,
div#menu1 ul.rMenu li.current-menu-item a,
div#menu1 ul.rMenu li a:hover,
div#menu1 ul.rMenu li a:active,
div#menu1 ul.rMenu li:hover a,
div#menu1 ul.rMenu li.current-menu-parent,
div#menu1 ul.rMenu li.current-menu-parent a {
color: #fff;
}

div#menu1 ul.rMenu li li {
background: #fefef6;
}

/* ======================= */
/* second level menu items */
/* ======================= */

div#menu1 ul.rMenu li ul.rMenu-ver li a {
color: #3a3a3a;
background: #ececec;
font-size: 13px;
padding: 0;
text-align: left;
height: auto;
}

div#menu1 ul.rMenu li.rMenu-expand li a span,
div#menu1 ul.rMenu li.rMenu-expand li li a span,
div#menu1 ul.rMenu li.rMenu-expand li li li a span {
padding: 11px 4px 10px 12px !important;
}

/* second level menu hover */
div#menu1 ul.rMenu li ul.rMenu-ver li a:hover {
color: #fff;
background: #959595;
}

/* second level current item */
div#menu1 ul.rMenu li ul.rMenu-ver li.current_page_item a,
div#menu1 ul.rMenu li ul.rMenu ver li.current-menu-item a {
color: #fff;
background: #959595;
}

div#menu1 ul.rMenu li.current_page_item ul.rMenu-ver li a:hover,
div#menu1 ul.rMenu li.current-menu-item ul.rMenu-ver li a:hover {
color: #fff;
background: none;
}

Last edited by steve955; Mar 29, 2013 at 06:47 PM.
 

Bookmarks

Tags
menu label, page menu, vertical alignment

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Black Line Above/Below Header and White Line Before Body Mande Header configuration & styling 1 Sep 9, 2010 08:54 AM
How to separate line items in widget content with a line? mgofootball Sidebars & Widgets 5 Jul 19, 2009 08:36 PM
How to change dotted border line in the layout to solid line? araneum Atahualpa 3 Wordpress theme 1 Feb 21, 2009 06:40 PM


All times are GMT -6. The time now is 09:40 AM.


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