WordPress.com Forums » Topic: Make menus bigger in Wu Wei

designsimply on "Make menus bigger in Wu Wei"

designsimply — Wed, 13 Feb 2013 21:50:04 +0000

Comments are stripped out by the CSS Tidy software used here at WordPress.com to keep file sizes as small as possible and to make sure it doesn't have any errors and so it loads faster.

We've updated! Comments can now be added using the WordPress.com CSS Editor. :)

thesacredpath on "Make menus bigger in Wu Wei"

thesacredpath — Sat, 26 Jan 2013 23:38:15 +0000

You are welcome.

squarepixel on "Make menus bigger in Wu Wei"

squarepixel — Sat, 26 Jan 2013 20:55:45 +0000

@thesacredpath : thanks for enlightening me regarding the treatment of comments in CSS, I wasn't aware of that!

@ruthmmciver : another thing you can do, to reduce even more drastically the spacing of the menus, is to reduce the width parameter to a lower em value:

.menu-main a {

    width: 9.08em;

}

Actually, to make it really tight, you can even replace that value with width: auto; and adjust the space using the margin-right value, as tesacredpath suggested.

timethief on "Make menus bigger in Wu Wei"

timethief — Sat, 26 Jan 2013 20:54:06 +0000

@thesacredpath
I did a ♫happy dance♫ when I saw your username on the board.
I know you are busy getting settled. I would love to receive an email whenever you have the time to update me on your adventures.

thesacredpath on "Make menus bigger in Wu Wei"

thesacredpath — Sat, 26 Jan 2013 20:50:04 +0000

@timethief, hope you are doing well. I'm quite busy at the moment with getting settled, but will probably be around the forums more than I have been.

thesacredpath on "Make menus bigger in Wu Wei"

thesacredpath — Sat, 26 Jan 2013 20:46:29 +0000

@ruthmmciver, it is difficult to evenly space the menu out over the width. You can do it, but if someone views your site with a smaller width screen, it can mean that the menu items will go to a second line, as is happening with yours. Also, each browser renders differently, so one browser may be fine and another will show two lines.

You can adjust the space to the right of the menu items by changing the value of the right margin. Add the following to the bottom of your custom CSS and then adjust the 1.819em value as desired.

.menu-main a {
margin-right: 1.819em;
}

timethief on "Make menus bigger in Wu Wei"

timethief — Sat, 26 Jan 2013 20:41:51 +0000

@thesacredpath
Alleluia! It's so good to see you here.
I missed you BIGTIME.

thesacredpath on "Make menus bigger in Wu Wei"

thesacredpath — Sat, 26 Jan 2013 20:39:54 +0000

Comments are stripped out by the CSS Tidy software used here at WordPress.com to keep file sizes as small as possible and to make sure it doesn't have any errors and so it loads faster.

CSS works differently here at WordPress.com. You are not editing the original CSS, you are overriding it. You have to create a rule to reverse or override the original parts of the CSS you want to deactivate.

ruthmmciver on "Make menus bigger in Wu Wei"

ruthmmciver — Sat, 26 Jan 2013 06:44:20 +0000

I would like to space out my menu topics evenly using the wu wei theme,
i have 5 topics on one line, then it knocks the final heading 'blog' onto the next line. Any idea of how I can make all headings on the one menu / line?

squarepixel on "Make menus bigger in Wu Wei"

squarepixel — Fri, 25 Jan 2013 16:03:29 +0000

That would be easy, you could just remove those pieces of code from your custom CSS Editor field.

Or if you want to keep it for future reference, you can make it inactive by placing it between comment markers, like this:

/* a comment, this code won't do anything now */

horbart on "Make menus bigger in Wu Wei"

horbart — Fri, 25 Jan 2013 14:05:19 +0000

Excellent, works really well!

Thanks.

If I, at a later stage, want to go back to default, what´s the procedure?

squarepixel on "Make menus bigger in Wu Wei"

squarepixel — Fri, 25 Jan 2013 13:12:13 +0000

That's a bit more tricky, as the markup of your theme isn't prepared for this. Also, we need to take into account the space taken by the WordPress admin bar.

But here is a quick fix you can try:

.full-column {
    position: fixed;
    top: 0;
    width: 100%;
    background: white;
}
#header {
    margin-top: 4em;
}
.admin-bar .full-column {
    top: 28px;
}
.admin-bar #header {
    margin-top: 4.5em;
}

horbart on "Make menus bigger in Wu Wei"

horbart — Thu, 24 Jan 2013 21:55:54 +0000

Great, thanks alot! Very helpful.

Another one for you;

- is there a way to fix the menus on the top of the page, so that when you scroll down they remain on top?

squarepixel on "Make menus bigger in Wu Wei"

squarepixel — Thu, 24 Jan 2013 15:44:40 +0000

In order to change the menu size by CSS, you could do something like this:

.menu-main { font-size: 1.5em; } .menu-main a { padding-bottom: 20px; }

And fine-tune the size and padding values to your liking.

About the comment-boxes - I don't see any on your site. Do you want to hide them from your editing interface? That would be the little "Screen Options" tab on top right, which lets you untick "Discussion" and "Comments".

horbart on "Make menus bigger in Wu Wei"

horbart — Wed, 23 Jan 2013 17:40:54 +0000

Hi,

I would like the top menus to slightly larger in Wu Wei. Is there a way to do this in CSS?

- I also want to get rid of the comment-boxes completely.. any ideas?
( I have done all the prescribed stuff that´s advised through support; the comment-function is disabled, but the actual boxes remains...)

Cheers,
Henrik