Skip to content

Instantly share code, notes, and snippets.

@gspice
Last active August 29, 2015 14:13
Show Gist options
  • Save gspice/2a6ffb876aa2f9a77f44 to your computer and use it in GitHub Desktop.
Save gspice/2a6ffb876aa2f9a77f44 to your computer and use it in GitHub Desktop.
wap - widen full page layout
//look for this
.full-width-content .content
//and changed the width from 740px to be something wider. The max width is 1140px.
//what i sent
On your site, when I use Inspect Element, I see this section of code:
/* Site Containers
--------------------------------------------- */
.wrap {
margin: 0 auto;
max-width: 1140px;
}
.site-inner {
background-color: #fff;
clear: both;
padding-top: 40px;
}
You would want to target these two sections and add the entries you want to overwrite or add-on. So in your CustomCSS section you would enter:
.wrap {
max-width: 960px;
}
.site-inner {
padding-right: 110px;
padding-left: 110px;
}
//what Amelia sent
.site-inner .wrap {
max-width: 960px;
padding: 0 110px;
}
.wrap {
margin: 0 auto;
max-width: 960px;
padding: 0 110px;
}
.site-header .wrap {
padding: 0 110px;
}
.footer-widgets .wrap {
padding: 40px 110px 16px;
}
Can you let me know if that helps? This code will align the whole lot at 960px and a padding of 110px on the left and right
//MOBILE WAS OFF
Try adding this in Design > Custom CSS:
@media only screen and (max-width: 768px) {
.wrap,
.site-header .wrap,
.footer-widgets .wrap {
padding-left: 0;
padding-right: 0;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment