Skip to content

Instantly share code, notes, and snippets.

@ehrenglaube
Created June 17, 2015 18:49
Show Gist options
  • Save ehrenglaube/dea045820c2d18f6d82a to your computer and use it in GitHub Desktop.
Save ehrenglaube/dea045820c2d18f6d82a to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
<div class='container'>
<h1>SASS - Nestings</h1>
<h2><span>Basic</span> - Getting Started</h2>
<p id='mypara'>Lorem ipsum dolor sit amet, consectetur
adipiscing elit, sed do eiusmod tempor <br>
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi</p>
</div>
// ----
// Sass (v3.4.7)
// Compass (v1.0.1)
// ----
$Color1: navy; // named color value
$Color2: #333333; // hex color value
$StringVar: " with Sass"; // string variable
$FontSize: 18px; // numeric value
$border: 1px solid $Color1; // multi-value variable
$padding: 15px 15px 15px 15px; // multi-value variable
.container {
width: 960px;
margin: 0 auto;
border: $border;
padding: $padding;
color: $Color2;
h1 {
font-size: $FontSize*3;
color: $Color1;
border-bottom: $border;
}
h2 {
font-size: $FontSize*2;
span {
font-style: italic;
&:before {
content: "- ";
}
}
&:after {
content:$StringVar;
text-decoration: underline;
}
}
}
.container {
width: 960px;
margin: 0 auto;
border: 1px solid navy;
padding: 15px 15px 15px 15px;
color: #333333;
}
.container h1 {
font-size: 54px;
color: navy;
border-bottom: 1px solid navy;
}
.container h2 {
font-size: 36px;
}
.container h2 span {
font-style: italic;
}
.container h2 span:before {
content: "- ";
}
.container h2:after {
content: " with Sass";
text-decoration: underline;
}
<div class='container'>
<h1>SASS - Nestings</h1>
<h2><span>Basic</span> - Getting Started</h2>
<p id='mypara'>Lorem ipsum dolor sit amet, consectetur
adipiscing elit, sed do eiusmod tempor <br>
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi</p>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment