A Bit of a New Look, or Fun With CSS

Filed under Blogging, CSS

The formatting of the code snippets I post from time to time have always bothered me.

They didn’t wrap, which is good (wrapping code just annoys the hell out of me), but they trailed off the edge and just appear to get cut off.

If you selected the text, it was all there and could be copied to the clipboard, but… well…. yuck.

Anyway, I finally figured out how to change the CSS such that you get a nice little scrolling window for the snippet.

I should point to Scott Hanselman’s blog as the source of the example I found, but I did tweak it a bit.

Here’s an example:

Public Function AppVersion$()
   '---- Get the Current Application file's "Full" version info
   Dim p$

   If IsIDE() Then
      '---- just pull from the App values (because the version resource
      '     isn't available
      AppVersion$ = App.Major & "." & App.Minor & ".0." & App.Revision
      '---- get from the VersionInfo resource, will include the real revision and build numbers
      AppVersion$ = GetFileVersion$(App.Path & "\" & App.EXEName)
   End If
End Function

Since this is purely a CSS thing, it works backwards in all my old posts, and it appears to be (so far) cross browser compatible.

Here’s the style (I’ve enclosed it in a STYLE tag so you can embed it directly in a html file, otherwise, just use the PRE definition).

<style type="text/css">
pre {
	border: 1px solid #e3a83d;
	border-left-width: 2px;
	background-color: #444;
	padding: 1em;
	margin: 2em;
	line-height: 1.2em;
	overflow: auto;
	width: 90%
	font-size: small;
	color: white;
	font-family: consolas, "Courier New", courier, monospace;

Yeah, it’s probably pretty minor stuff for all the CSS genii out there, but I’m still surprises with what you can do with a little CSS. Makes me really want to get into the whole WPF thing. 

One Comment

  1. Ralf says:

    Oooh, pretty. I like the horizontal scroll bars.

Post a Comment

Your email is never published nor shared. Required fields are marked *