Skip to content

Instantly share code, notes, and snippets.

@mvkasatkin

mvkasatkin/menu.css

Last active February 2, 2018 06:33
Show Gist options
  • Save mvkasatkin/80e0161c1a6771a59bf9894045403646 to your computer and use it in GitHub Desktop.
Save mvkasatkin/80e0161c1a6771a59bf9894045403646 to your computer and use it in GitHub Desktop.
Download ZIP
Horizontal flex menu with equal gaps between text
Raw
menu.css
.menu {
display: flex;
}
.menu ._item {
flex: 1 0 auto;
border: 1px solid red;
padding: 20px auto;
text-align: center;
}
Raw
menu.html
<div class="menu">
<div class="_item">Item 1</div>
<div class="_item">Item 2</div>
<div class="_item">Item 3 long title</div>
<div class="_item">Item 4</div>
<div class="_item">Item 5</div>
</div>
@mvkasatkin
Copy link
Author

https://codepen.io/anon/pen/PQPMee

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment