Indenting/Padding Blog Posts and Widgets – Lifestyle Pro

[[email protected]]

I have changed my .site-container so that the header spans the entire page with no padding top or left and right. However, in setting the padding to 0 in the .site-container - all post boxes and widget boxes are now flush with the edge. How do I change the padding of them?

Here is the site http://www.travellingfortwo.com

Here is the code I changed in the .site-container

.site-container {
background-color: #FFFCF3;
box-shadow: 0 0 5px #194F7C;
margin: 32px auto;
margin: 3.2rem auto;
max-width: 1140px;
overflow: hidden;
padding: 36px;
padding: 0px;
}

http://www.travellingfortwo.com

[Sridhar Katakam]

Try this CSS:

.site-container {
	padding: 36px;
	padding: 3.6rem;
}

.site-header {
    margin-left: -3.6rem;
    margin-right: -3.6rem;
    margin-top: -3.6rem;
}

.nav-secondary {
    margin-left: -3.6rem;
    margin-right: -3.6rem;
}

@media only screen and (max-width: 1023px) {

	.site-header {
		padding: 0;
	}

}

---

Genesis Tutorials | Follow me on Twitter

[Author]

Posts