<Code> tags CSS Like Wikipedia

Question

I am coding some pages in HTML and CSS which will contain samples of code. I want to have the grey box like the do on WikiPedia (I know this is done with Media Wiki). An example page is:

http://en.wikipedia.org/wiki/Dd_(Unix)#Uses

You will see the code has a grey box with dotted lines around. Also higher up the page where just 'dd' is used the text is monospace but no box is shown.

Could you tell me how I get the same styles with CSS around the tag?

Thanks

Peter Jones

Answer 1

HTML

<code>dd if=/dev/sda of=MBR.img bs=512 count=1</code>​

CSS

code{background:#F8F8FF; border:black dashed 1px; padding:6px}​

DEMO