Say you want the background and/or border of the sidebar to extend the full height of the page…
0 1 2 3 4 5 6 7 8 9 10 11 | .container { overflow: hidden; .... } #sidebar { margin-bottom: -5000px; padding-bottom: 5000px; .... } |
CSS Columns
Need to style code into columns. This is for simple auto-generated paragraph in a post or page.
0 1 2 3 4 5 6 7 8 9 10 | .postid-1121 .entry-content > p { width: 48%; margin-left: 4%; float: left; } .postid-1121 .entry-content > p:nth-of-type(2n+1) { clear: both; margin-left: 0; } |
or for three col:
0 1 2 3 4 5 6 7 8 9 10 | .postid-1121 .entry-content > p { width: 30%; margin-left: 5%; float: left; } .postid-1121 .entry-content > p:nth-of-type(3n+1) { clear: both; margin-left: 0; } |
or four:
0 1 2 3 4 5 6 7 8 9 10 | .postid-1121 .entry-content > p { width: 22%; margin-left: 4%; float: left; } .postid-1121 .entry-content > p:nth-of-type(4n+1) { clear: both; margin-left: 0; } |
CSS3 Drop Shadows
This is simple stuff, but good code to keep handy. This covers all current major browsers and add backward compatibility for ie. The first number is horizontal shift (right is positive), 2nd number is verticle shift (down is positive), 3rd is radial blur and forth is, in this case hexadecimal color (#3d424d is a dark […]