Monday, February 13, 2012

CSS code box

This is the CSS I'm going to use to style my code snippets:
.code {
 background:#f5f8fa;
 background-repeat:no-repeat;
 border: solid #5C7B90;
 border-width: 1px 1px 1px 20px;
 color: #000000;
 font: 13px 'Courier New', Courier, monospace;
 line-height: 16px;
 margin: 10px 0 10px 10px;
 max-height: 300px;
 min-height: 16px;
 overflow: auto;
 padding: 28px 10px 10px;
 width: 90%; 



.code:hover {
 background: #FAFAFA;
 background-repeat:no-repeat;
}
Feel free to copy the above classes to use on your own site / blog. Simply put all your markup within a 'div' tag with class='code', and presto.

No comments:

Post a Comment