Skip to content

Instantly share code, notes, and snippets.

@NapoleonWils0n
NapoleonWils0n / center_align_left_floated_elements.css
Created November 1, 2012 20:23
css: center align left floated elements
ul {
margin: 20px;
padding: 0;
list-style-type: none;
text-align: center;
}
li {
display: inline-block;
margin: 0;
@NapoleonWils0n
NapoleonWils0n / centre_div_negative_margins.css
Created November 1, 2012 20:23
css: center div negative margins
div { position: absolute; left: 50%; width: 500px; margin-left: -250px; /*half the width of the div*/}
@NapoleonWils0n
NapoleonWils0n / clearfix_all_browsers.css
Created November 1, 2012 20:24
css: clearfix all browsers
/* =Clearfix (all browsers)--------------------------------*/.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}/* IE6 */ * html .clearfix {height: 1%;}/* IE7 */*:first-child+html .clearfix {min-height: 1px;}
@NapoleonWils0n
NapoleonWils0n / clearing_div.css
Created November 1, 2012 20:25
css: clearing div
.clearing {clear:both; height:0; overflow:hidden; margin:-1px 0 0 0;}
@NapoleonWils0n
NapoleonWils0n / cross_browsre_opacity.css
Created November 1, 2012 20:25
css: cross browser opacity
.transparent_class {
/* IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
/* IE 5-7 */
filter: alpha(opacity=50);
/* Netscape */
-moz-opacity: 0.5;
@NapoleonWils0n
NapoleonWils0n / css_box_shadow.css
Created November 1, 2012 20:27
css: box shadow
.shadow {
box-shadow: 5px 5px 5px #ccc;
-moz-box-shadow: 5px 5px 5px #ccc;
-webkit-box-shadow: 5px 5px 5px #ccc;
}
@NapoleonWils0n
NapoleonWils0n / css_hidding.css
Created November 1, 2012 20:27
css: css hiding
#content {
position: absolute;
left: -9999px;
}
@NapoleonWils0n
NapoleonWils0n / css_selectors.css
Created November 1, 2012 20:28
css: css selectors
/*----------------------------------------------------------------------------------------*/
/* CSS Selectors */
/*----------------------------------------------------------------------------------------*/
* /* any element */
E /* an element of type E */
E[foo] /* an E element with a "foo" attribute */
E[foo="bar"] /* an E element whose "foo" attribute exactly equal to "bar" */
E[foo~="bar"] /* an E element whose "foo" attribute of whitespace-separated values, one of which is exactly equal to "bar" */
@NapoleonWils0n
NapoleonWils0n / form_placeholder.css
Created November 1, 2012 20:29
css: form placeholder
input::-webkit-input-placeholder,
input:-moz-placeholder {
color: rgba(170,170,170,1);
}
@NapoleonWils0n
NapoleonWils0n / glass effect.css
Created November 1, 2012 20:29
css: glass effect
/* glass */
#poster:after {
content: -webkit-gradient(linear,left top, right top,
from(rgba(255,255,255,0.2)),
to(rgba(255,255,255,0.2)),
color-stop(0.5, rgba(255,255,255,0.5)),
color-stop(0.6, rgba(255,255,255,0.1)),
color-stop(0.605, rgba(255,255,255,0.1)));