Darcy Clarke on how you can give the Web Inspector in Chrome a facelift (with example stylesheet). …
Generated content means pseudo elements added to the page via the ::before and ::after. The support for applying transitions or animations to these in the current browser landscape is not great. I think this is a huge bummer, so …
Jeremy Keith shows us how to put the navigation on the bottom of the page in a vertical layout for small screens and the top of the page in a horizontal layout for large screens by fiddling with the the …
Louis Lazaris shows us how space and round give us some more possibilities with how repeating backgrounds are dealt with in CSS3.…
A popular design technique is to create a content container that looks like a sheet of paper and to stack other sheets of paper below it, adding a layered or three-dimensional style. We can create this effect using straight up …
These buttons (like one for adding an <hr> tag) aren’t there by default in the WordPress visual editor, but you can turn them on pretty easily. This is code for your active theme’s functions.php file, or make a functionality plugin…
This is some code to get the header of some content area to stay visible at the top of the screen as you scroll through that content. Then go away when you’ve scrolled past that relevant section.…
From the footer of the v8 design of CSS-Tricks.
footer {
clear:both;
overflow:hidden;
font-size:16px;
line-height:1.3;
}
#footer-boxes {
-moz-column-count:2;
-moz-column-gap:10px;
-webkit-column-count:2;
-webkit-column-gap:10px;
column-count:4;
column-gap:10px;
}
.footer-box {
margin:0 0 10px 0;
display:inline-block;
width:262px;
height:140px;
padding:15px;
background:#e6e2df;
color:#b2aaa4;
-webkit-transition:all From the v8 design of CSS-Tricks.
nav {
background: #444;
border-bottom: 8px solid #E6E2DF;
overflow: hidden;
position: relative;
width: 100%;
}
nav:after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 2px;
background: white;
}
For your functions.php file in the theme.
add_theme_support( 'post-formats',
array(
'aside',
'gallery',
'link',
'image',
'quote',
'status',
'video',
'audio',
'chat'
)
);
add_post_type_support( 'post', 'post-formats' );
add_post_type_support( 'page', 'post-formats' );
// and other custom post types if you have them