Skip to content

Instantly share code, notes, and snippets.

@srikat
Last active October 29, 2016 01:08
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save srikat/7e24de004ab461eda74f to your computer and use it in GitHub Desktop.
Using Flexbox for equal height columns in Digital Pro. https://sridharkatakam.com/using-flexbox-for-equal-height-columns-in-digital-pro/
@media only screen and (max-width: 860px) {
#front-page-3 .widget-area a.button {
padding: 12px 15px;
}
}
#front-page-3 .widget-area {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
#front-page-3 .widget-area a.button {
position: absolute;
bottom: 0;
left: 50%;
-webkit-transform: translate(-50%, 0);
-moz-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
-o-transform: translate(-50%, 0);
transform: translate(-50%, 0);
}
#front-page-3 .widget:nth-child(2),
#front-page-3 .widget:nth-child(3),
#front-page-3 .widget:nth-child(4) {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
position: relative;
padding-bottom: 50px;
}
#front-page-3 .widget-area a.button.small {
padding: 12px 20px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment