How to make the top bar fixed in Swank

A user in StudioPress asks:

I bought the Swank theme a few days ago and I was hoping to be able to make the top two widgets (the one with the social icons and the other with the text) static, so that it scrolls down with the user.

How would I go about doing that?

Here’s how we can make the top bar in Swank, a Genesis child theme fixed/sticky/static (however you want to term it) so that it always remains in view at widths higher than 1140px.

2014-09-19_13-39-51

Add the following in style.css:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22
@media only screen and (min-width: 1140px) {
 
.top-bar {
padding-top: 0;
padding-bottom: 0;
}
 
.top-bar .wrap {
position: fixed;
z-index: 100;
padding-top: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #ddd;
width: 100%;
background: #fff;
}
 
.site-header {
padding-top: 46px;
}
 
}
view raw style.css hosted with ❤ by GitHub