I need to have some sections of code in my blog, as any good geek blog would. Here is what I added to my blog’s style sheet to support my code entries. In fact, the presentation of the css code uses the code definitions in the style sheet. Can you say recursion?
.code {
font-family:’Courier New’, Courier, Monospace, Fixed;
line-height: .6em;
font-size: 110%;
white-space: pre;
border: 2px ridge #0f5384;
padding: .5em;
background-color: #fffeef;
color: #511211;
min-width: 10em;
overflow: auto;
}
/* section to define text used to show computer input */
.code b {
font-weight: 900;
color: #0f5384;
}
/* section to define text used to show my comments within the code box */
.code i {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-effect: italic;
white-space: normal;
line-height: 1em;
}
Then I apply the code format using <div class=”code”> and then, within that div section, use <b> to indicate text that is input to the system, and <i> to indicate text that is a comment I wrote in the code box. It’s nothing fantastic, but it’ll do the job.