Skip to content

Instantly share code, notes, and snippets.

@starryeyez024
Last active March 18, 2019 18:44
Show Gist options
  • Select an option

  • Save starryeyez024/10d3278633190d1d66b62d3d4ef5abc1 to your computer and use it in GitHub Desktop.

Select an option

Save starryeyez024/10d3278633190d1d66b62d3d4ef5abc1 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
<div class="container">
<div class="logo">Logo</div>
<div class="links">
<ul>
<li>Try</li>
<li>Learn</li>
<li>Buy</li>
</ul>
</div>
</div>
// ----
// libsass (v3.5.4)
// ----
.container {
display: flex;
width: 100%;
background: lightgray;
padding: 20px 0;
justify-content: space-between;
align-items: center;
}
.logo {
background: pink;
width: 150px;
margin-left: 10px;
}
.links {
display: block;
flex: 1;
}
ul {
list-style-type: none;
margin: 0;
display: flex;
justify-content: center;
}
li {
display: inline-block;
padding: 0 30px;
margin: 0;
}
.container {
display: flex;
width: 100%;
background: lightgray;
padding: 20px 0;
justify-content: space-between;
align-items: center;
}
.logo {
background: pink;
width: 150px;
margin-left: 10px;
}
.links {
display: block;
flex: 1;
}
ul {
list-style-type: none;
margin: 0;
display: flex;
justify-content: center;
}
li {
display: inline-block;
padding: 0 30px;
margin: 0;
}
<div class="container">
<div class="logo">Logo</div>
<div class="links">
<ul>
<li>Try</li>
<li>Learn</li>
<li>Buy</li>
</ul>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment