Skip to content

Instantly share code, notes, and snippets.

@jsakhil
Forked from brettsnippets/flexbox.css
Last active March 14, 2020 05:29
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save jsakhil/1b41851e5b07616bd654dadddbfbf1ff to your computer and use it in GitHub Desktop.
Save jsakhil/1b41851e5b07616bd654dadddbfbf1ff to your computer and use it in GitHub Desktop.
Flexbox "Cross Browser" Sample
.content {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: vertical;
-moz-box-orient: vertical;
-ms-box-orient: vertical;
box-orient: vertical;
width: 100%;
}
.main, .sidebar {
width: 100%;
}
.main {
-webkit-box-ordinal-group: 2;
-moz-box-ordinal-group: 2;
-ms-flex-order: 2;
-webkit-order: 2;
order: 2;
}
.sidebar {
-webkit-box-ordinal-group: 1;
-moz-box-ordinal-group: 1;
-ms-flex-order: 1;
-webkit-order: 1;
order: 1;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment