css.md

css

---

evenly spaced menu items

.item-wrap-selector {
	display: table;
	table-layout: fixed; /* Makes items equal width by default */
	width: 100%;
}
.menu-item-selector {
	display: table-cell;
}

from comment here. Or see using the WP built-in nav_menu_css_class filter on Bill Erickson's site

---

modern clearfix

.group:before,
.group:after {
    content:"";
    display:table;
}
.group:after {
    clear:both;
}
.group {
    zoom:1; /* For IE 6/7 (trigger hasLayout) */
}

from css-tricks

---

the picture element

(from An Event Apart Digest, Issue 3)

The picture element introduces a smarter way of loading images. We can use a syntax that tells the browser to disregard a source unless it recognizes the contents of a type attribute, meaning only one server request gets made.

<picture>
   <source type="image/svg+xml" srcset="pic.svg">
   <img src="pic.png" alt="…">
</picture>

---

hiding text

Instead of the familiar left:-9999px, from zeldman.com:

.hide-text {
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}