Change menu position & reduce padding between profile & begin home page

tltgisch · Member · Apr 10, 2017 at 2:26 pm
Copy link

Add topic to favorites
Hi there!

I would like to do two things with the layout of my site (nonesuchediting.com) via the CSS editor, if possible. I am using the Libre 2 theme.

1) Move my menu so that it is centered in the middle of the page, rather than right-aligned.

2) On my home page, reduce the empty white space between the bottom of the three portfolio elements (photos + titles) and the beginning of the home page text (Drop cap N and text: “Nonesuch Editing specializes in academic, development aid, and nonfiction editing for….”).

I appreciate any help you can give me today with either of these issues!

Thanks,
Theresa

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Apr 11, 2017 at 3:03 am
Copy link
Hi Theresa,

1) Move my menu so that it is centered in the middle of the page, rather than right-aligned.

Add the following to your custom CSS to center the menu.
```
.main-navigation {
	width: 100%;
	text-align: center;
}
.main-navigation li:first-of-type {
	margin-left: 0;
}
```
If you also wish to reduce the space between the header image and the menu, add the following and adjust the bottom margin as desired. You can enter decimal values as well, such as 2.2em or 2.25em, or even 0.4em.
```
.custom-header {
    margin-bottom: 3em;
}
```
2) On my home page, reduce the empty white space between the bottom of the three portfolio elements (photos + titles) and the beginning of the home page text …

Add the following to your custom CSS.
```
.jetpack-portfolio-shortcode .portfolio-entry {
	margin-bottom: 0;
}
```
tltgisch · Member · Apr 11, 2017 at 11:07 am
Copy link
Wow! thesacredpath—You really are a happiness engineer! These worked perfectly and look great. Thank you so much! It really does make me want to learn how to customize CSS on my own. Do you teach online anywhere?

Once again, thanks so much.

Absolute best,
T
thesacredpath · Member · Apr 11, 2017 at 8:27 pm
Copy link
Theresa, you are welcome, and no I do not teach anywhere, but there are quite a few good online sources for learning CSS. CSS here works a bit differently in that we have to override the existing CSS instead of just editing the original, and that is something most of the resources don’t really cover, but once you have a basic understanding, it isn’t that hard to use your web inspector and find what you need. The great thing about CSS is you don’t have to worry about permanently breaking your site. If you add something and things go awry, you just remove that part and save and everything is back to the way it was.

No items found.