Carlos Sánchez carlos-sanchez
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
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Untitled</title> | |
| <!--[if lt IE 9]> | |
| <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> | |
| <![endif]--> | |
| </head> | |
| <body> |
carlos-sanchez
/ responsive-tables.css
Created
November 17, 2013 17:33
Responsive tables (the easiest way)
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
| table{ | |
| display:block; | |
| max-width: 100%; | |
| overflow-y:scroll; | |
| } |
carlos-sanchez
/ text-highlight.css
Created
November 22, 2013 02:44
Text highlight More techniques here: http://css-tricks.com/multi-line-padded-text/
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
| .padded-multi-line { | |
| display: inline; | |
| background: orange; | |
| box-shadow: 10px 0 0 orange, -10px 0 0 orange; | |
| } |
carlos-sanchez
/ absolute-center-inline-block.css
Created
November 25, 2013 01:04
Absolute Center with Inline Block.
The content block’s width must be declared to be no wider than 100% of the container minus 0.25em if the content is wider than the container. like a block with long paragraph text. Otherwise, the content block will be pushed to the top, which is the reason for using :after. Using :before caused the content to b…
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
| .Center-Container.is-Inline { | |
| text-align: center; | |
| overflow: auto; | |
| } | |
| .Center-Container.is-Inline:after, | |
| .is-Inline .Center-Block { | |
| display: inline-block; | |
| vertical-align: middle; | |
| } |
carlos-sanchez
/ absolute-center-flexbox.css
Last active
November 10, 2016 16:17
Absolute Center with flexbox.
Content can be any width or height, even overflows gracefully
No IE8-9 support
Requires a container or styles on the body
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
| .Center-Container.is-Flexbox { | |
| display: -webkit-box; | |
| display: -moz-box; | |
| display: -ms-flexbox; | |
| display: -webkit-flex; | |
| display: flex; | |
| -webkit-box-align: center; | |
| -moz-box-align: center; | |
| -ms-flex-align: center; | |
| -webkit-align-items: center; |
carlos-sanchez
/ justified-v-centered-header-elements.css
Created
November 27, 2013 03:07
Justified and Vertically Centered Header Elements http://tympanus.net/codrops/2013/07/14/justified-and-vertically-centered-header-elements/
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
| /* For justifying */ | |
| header { | |
| text-align: justify; | |
| letter-spacing: 1px; | |
| height: 8em; | |
| padding: 2em 10%; | |
| background: #2c3e50; | |
| color: #fff; | |
| } |
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
| <script> | |
| var iOS = ( navigator.userAgent.match(/(iPad|iPhone|iPod)/g) ? true : false ); | |
| if (iOS = true){ | |
| //whatever | |
| } | |
| </script> |
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
| Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
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
| $( document ).ready(function() { | |
| //whatever | |
| }); | |
| // Shorthand for $( document ).ready() | |
| $(function() { | |
| //whatever | |
| }); |
carlos-sanchez
/ config.json
Created
September 23, 2015 07:47
— forked from anonymous/config.json
Bootstrap Customizer Config
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
| { | |
| "vars": { | |
| "@gray-base": "#404a49", | |
| "@gray-darker": "darken(@gray-base, 20%)", | |
| "@gray-dark": "darken(@gray-base, 13.5%)", | |
| "@gray": "#404a49", | |
| "@gray-light": "lighten(@gray-base, 46.7%)", | |
| "@gray-lighter": "lighten(@gray-base, 93.5%)", | |
| "@brand-primary": "#38b095", | |
| "@brand-success": "#7CD1B8", |