CSS Styles

Apply CSS Based on Attribute

This just seems like less typing to me. Why type out class="something", especially in a wiki where you have to type it all the time.

CSS:

div[red] {
	color: red;
}
div[blue] {
	color: blue;
}

HTML:

<div red>
This should be red.
</div>
<div blue>
This should be blue.
</div>

RESULT:

This should be red.
This should be blue.

Absolute Center (via Flexbox)

.absolute-center {

	/* Internet Explorer 10 */
	display:-ms-flexbox;
	-ms-flex-pack:center;
	-ms-flex-align:center;

	/* Firefox */
	display:-moz-box;
	-moz-box-pack:center;
	-moz-box-align:center;

	/* Safari, Opera, and Chrome */
	display:-webkit-box;
	-webkit-box-pack:center;
	-webkit-box-align:center;

	/* W3C */
	display:box;
	box-pack:center;
	box-align:center;

}

Wrap Text in <​pre> Tag

/* wrap text in pre tag, good for mobile because pre won't extend beyond screen width */
pre.wrap {
    white-space: pre-wrap;       /* Since CSS 2.1 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
}