Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Page & Category Menu Bars (http://forum.bytesforall.com/forumdisplay.php?f=10)
-   -   how to change size of page menu bar - via style sheet? (http://forum.bytesforall.com/showthread.php?t=1398)

mamboe29 Apr 23, 2009 12:31 PM

how to change size of page menu bar - via style sheet?
 
hi Flynn,

New to both WordPress and Atahualpa but enjoying it already, I cannot seem to figure out a way to change the size of my page menu options. I want a little more space between the page title and the "box" it is in.. Using version 3.2.2 and WordPress 2.7.1. Am also new to CSS and HTML and what have you.

I thought of trying to add some code to the Style sheet but despite changing permission rights via my control panel, the editor function does not seem to have any "save" button after I have done so..

What do I do? My URL is: http://www.madeleineboerma.com/blog/

Example of what I want: more space left and right of e.g. About me, Archives, Books so it looks spacier than now.

Very happy thus far with your theme. Cannot believe how much it allows me to customize my blog (and I am not even an experienced user yet!).

Thanks, Mamboe

ps tried to find similar question/answer but could not find one hence the new thread

Flynn Apr 24, 2009 08:16 PM

Add this at HTML/CSS Inserts:

HTML Code:

ul.rMenu li a:link,
ul.rMenu li a:hover,
ul.rMenu li a:visited,
ul.rMenu li a:active {
padding: 4px 5px 4px 5px;
}

The values above are the default values, in this order: TOP RIGHT BOTTOM LEFT

mamboe29 May 4, 2009 09:19 AM

Hi Flynn,

Thanks. I tried but somehow it does not work yet.. Will work on it a bit more and find out or get back to you.

Thanks, Madeleine

Memento Vivi May 7, 2009 02:48 PM

@ Flynn, thanks a lot, just what I was looking for!

@ Mamboe:
You need to change the numbers, for example:

ul.rMenu li a:link,
ul.rMenu li a:hover,
ul.rMenu li a:visited,
ul.rMenu li a:active {
background: #ffc800;
padding: 4px 15px 4px 15px;
}
div#menu1 ul.rMenu-hor li.rMenu-expand a {
padding: 4px 22px 4px 15px;
}

I also added a background-color, because I didn't want the whole menu bar, to the end of the page, to be colored, only the links of the page-menus.
And I added div#menu1... to expand the link of the pages with the dropdown-menu

For an example you can visit http://www.books.an/Curacao-webwinkel/ - nevertheless it is still under construction. I am trying to build a web shop...

mamboe29 May 17, 2009 07:51 AM

@ memento vivi,

The funny thing is, i tried just that.. I even went as far as to add the following numbers and nothing changed on my blog. Yours looks exactly like i wanted.. a bit more space before and after each page title.. Mysterious why it does not work with me. I added it in HTML/CSS inserts. I tested both 15-40 and even 100px and nothing changed left or right..

ul.rMenu li a:link,
ul.rMenu li a:hover,
ul.rMenu li a:visited,
ul.rMenu li a:active {
padding: 4px 40px 4px 40px;
}

What am i not getting right here?

Thanks for your reply!

Mamboe

Flynn May 17, 2009 05:49 PM

Remove the red part from your CSS Inserts, or put it in between { ... } somewhere

h3 {
font-size: 14px;
letter-spacing:0.1em;
color:#8DB8E3;
line-height:145%;
}

font-family: arial, helvetica, sans-serif;

ul.rMenu li a:link,
ul.rMenu li a:hover,
ul.rMenu li a:visited,
ul.rMenu li a:active {
padding: 4px 40px 4px 40px;
}

mamboe29 May 20, 2009 03:21 AM

@ Flynn,

Thank you sooooo much!!! I'm so new to CSS/HTML and had not thought of that. Thanks. It works!! You've made my day!! :)

Ciao Mamboe

flowflow May 26, 2009 12:05 PM

Nice very nice.. It works good, but, but .. page title with sub menu are not space reacting
How do I do? exemple: http://ine.bluetattoo.be/
PS Flynn, for my "page go to down" it ' is, a script from a web hacking action :(

Flynn May 27, 2009 07:23 AM

Those with sub menus have an extra padding setting to make room for the arrow image. Try

div#menu1 ul.rMenu-hor li.rMenu-expand a {
padding: ....
}

The default is
padding-left:5px;padding-right:15px;

or use div#menu2 for the categories menu bar

flowflow May 27, 2009 10:56 AM

woow indeed it works well, thanksssssss a lot Fynn!

JennAOrtiz Apr 20, 2010 01:36 PM

I inserted this code into my CSS Inserts but it didn't work. What am I doing wrong? I'd like to add some padding to each button on the page menu without changing the size of the font.

http://newsmakerssouthflorida.com/


All times are GMT -6. The time now is 07:59 AM.

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