[Theme: Monaco] help removing padding and spacing

Hey Tiffany
Can you post a link to your site and ill have a look?

First off, you’ll need to create a ‘Child Theme’ for your site.

http://codex.ww.wp.xz.cn/Child_Themes

Basically a child theme will allow you to make changes to the backend coding of your site without losing those changes if your theme ever gets updated.

Once you have done that you can make changes to the CSS styling file that is found in the sub-menu of your WordPress Admin page labelled ‘Appearance > Editor’

Inside the editor there will be a file called ‘style.css’ and this is where you can make changes to the styling of the site.

In ‘style.css’ there is a section that looks like this at line 541:

/* =Content
----------------------------------------------- */
#page {
	margin: 0 auto;
	width: 1040px;
	padding:0 20px;
	background-color:#fff;
	overflow: hidden;
}
.site-header {
  border-bottom:2px solid #4b4b4d;
}
.site-branding {
	padding: 30px;
	text-align: center;
}

To remove the padding between your header and the menu bar, change the value of ‘padding:’ under ‘.site-branding’ to:

.site-branding {
	padding: 30px 30px 0 30px;
	text-align: center;
}

That will reduce the space between the logo and the menu bar underneath while maintaining the rest of the padding on the top and sides.

Make these changes inside ‘style.css’

.content-area {
	margin-top: 20px;
	width: 70%;
	float: left;
	padding-right: 2%;
	border-right: 1px solid #eeeeee;
}

To:

.content-area {
	margin-top: 0px;
	width: 70%;
	float: left;
	padding-right: 2%;
	border-right: 1px solid #eeeeee;
}

And separate out ‘.entry-content’ so its one its own as seen below:

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

to:

.page-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.entry-content {
	margin: 0;
}

Just make sure that you have created a Child Theme or all of that will be reverted once the theme updates.