theshepherd theshepherd - 1 year ago 168
Sass (Sass) Question

Full width header in jekyll?

In Jekyll all content has specific width. As I understand this comes from


$content-width: 800px;
$on-palm: 600px;
$on-laptop: 800px;

I tried using "local" css in order to overwrite these. And it didn't worked.

Also the above affects the whole content.

Is there any way to make the header (
) full width and keep the rest content with the default-centered width (inherited from above)?

Answer Source

In _includes/header.html, change <div class="wrapper"> for <div class="wrapper-header">.

In _sass/base.scss add :

.wrapper-header {
    padding-right: $spacing-unit;
    padding-left: $spacing-unit;
    @extend %clearfix;

    @include media-query($on-laptop) {
        padding-right: $spacing-unit / 2;
        padding-left: $spacing-unit / 2;
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download