Michael Hairston mhairston
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .u-center-vertical-flex { | |
| display: flex; | |
| align-items: center; | |
| } | |
| /* to include IE10: */ | |
| .u-center-vertical-flex { | |
| display: -ms-flex; | |
| display: flex; |
mhairston
/ center-vertical.css
Last active
November 5, 2015 18:37
Vertically Center in 3 lines of CSS
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* | |
| Vertically center | |
| From http://csstricks.com | |
| No styles needed on parent. | |
| */ | |
| .u-vertical-center { | |
| position: relative; | |
| top: 50%; | |
| -webkit-transform: translateY(-50%); |
mhairston
/ inline-break.css
Last active
September 28, 2015 11:13
Insert line break after inline element
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* | |
| Insert a line break after inline element | |
| (not the same as display:block) | |
| from CSS Secrets by Lea Verou | |
| */ | |
| .u-line-break::after { | |
| content: '\A'; | |
| white-space: pre; | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* From http://csshexagon.com, natch! */ | |
| .hexagon { | |
| position: relative; | |
| width: 300px; | |
| height: 173.21px; | |
| background-color: #64C7CC; | |
| margin: 86.60px 0; | |
| } | |
| .hexagon:before, |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Convert Array-like object to Array: | |
| var unboundSlice = Array.prototype.slice; | |
| var slice = Function.prototype.call.bind(unboundSlice); | |
| function list() { | |
| return slice(arguments); | |
| } | |
| var list1 = list(1, 2, 3); // [1, 2, 3] |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| ¯\_(ツ)_/¯ |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Include | |
| {% include footer.html %} | |
| Include with params | |
| {% include footer.html param="value" variable-param=page.variable %} | |
| {{ site.time | date_to_string }} | |
| 07 Nov 2008 | |
| Include a gist -- filename optional. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Module pattern | |
| ABC = ABC || {}; | |
| ABC.ModuleName = (function() { | |
| function render_donut(el) { | |
| dostuff(); | |
| } | |
| function init(){ |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <style> .ns-newcsslib .grid--debug {outline: 5px solid #f00;height: 100px;} .ns-newcsslib .grid--debug [class^="col-"] {height:100%; background-color:#fee; display:block;}</style> | |
| <div class="grid grid--debug"> <div class="col-1"> </div> <div class="col-1"> </div> <div class="col-1"> </div> <div class="col-1"> </div> <div class="col-1"> </div> <div class="col-1"> </div> <div class="col-1"> </div> <div class="col-1"> </div> <div class="col-1"> </div> <div class="col-1"> </div> <div class="col-1"> </div> <div class="col-1"> </div> </div> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div style="background-color: #e64f35; border-radius: 50%; width: 160px; height: 160px; padding: 3px; margin: 2rem; border: 1rem solid #e64f35;color:#fff; font-size:3rem; text-align:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;"> | |
| <div> | |
| 56<small>%</small> | |
| </div> | |
| </div> |