Skip to content

Instantly share code, notes, and snippets.

@jhnsnc
Last active August 29, 2015 14:22
Show Gist options
  • Select an option

  • Save jhnsnc/52242349385191c41887 to your computer and use it in GitHub Desktop.

Select an option

Save jhnsnc/52242349385191c41887 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
<ul class="top-nav">
<li>
<a href="#a">Solutions</a>
</li>
<li>
<a href="#b">Catalog</a>
</li>
<li>
<a href="#c">Pricing</a>
</li>
<li>
<a href="#d">Docs</a>
</li>
<li>
<a href="#e">Community</a>
</li>
</ul>
// ----
// Sass (v3.3.14)
// Compass (v1.0.3)
// ----
/* Styles */
body {
background: #444444;
color: #E0E0E0;
font-family: 'HelveticaNeue', Helvetica, Arial, sans-serif;
text-transform: uppercase;
}
.top-nav {
padding: 0;
margin: 0;
li {
display: block;
float: left;
list-style: none;
border-left: 1px solid #E0E0E0;
a {
display: inline-block;
padding: 20px;
color: #E0E0E0;
text-decoration: none;
}
}
}
/* Styles */
body {
background: #444444;
color: #E0E0E0;
font-family: 'HelveticaNeue', Helvetica, Arial, sans-serif;
text-transform: uppercase;
}
.top-nav {
padding: 0;
margin: 0;
}
.top-nav li {
display: block;
float: left;
list-style: none;
border-left: 1px solid #E0E0E0;
}
.top-nav li a {
display: inline-block;
padding: 20px;
color: #E0E0E0;
text-decoration: none;
}
<ul class="top-nav">
<li>
<a href="#a">Solutions</a>
</li>
<li>
<a href="#b">Catalog</a>
</li>
<li>
<a href="#c">Pricing</a>
</li>
<li>
<a href="#d">Docs</a>
</li>
<li>
<a href="#e">Community</a>
</li>
</ul>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment