solutions to commonly encountered css scenarios

common_css_scenarios.css

/* vertical align button in absolute div */

/* https://css-tricks.com/centering-css-complete-guide */



/* whitespace between inline-blocks */



/* remove padding and margin from page */
html,body {
height: 100%;
margin: 0;
padding: 0;
overflow-x: hidden;
}

/* set border-box for all elements */
*,:before,:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

/* media queries */
/* (http://cssmediaqueries.com/what-are-css-media-queries.html) */
/* (https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries) */
/* (http://getskeleton.com/#queries) */
/* mobile first queries */
/* larger than mobile */
@media (min-width: 400px) {

}

/* larger than phablet */
@media (min-width: 550px) {

}

/* larger than tablet */
@media (min-width: 750px) {

}

/* larger than desktop */
@media (min-width: 1000px) {

}

/* larger than desktop hd */
@media (min-width: 1200px) {
  
}