Playing around with DotNetNuke again today for work and the CSS implementation leaves a lot to be desired. For some reason (open source? – multiple contributors?) the CSS has hundreds of redundant definitions and the code base itself adds unnecessary or at least unwanted IDs or CLASS tags to everything.

Rather than have a single FONT-FAMILY declaration, it was declared on almost every style. Instead of BORDER, BORDER-RIGHT, BORDER-LEFT, BORDER-TOP, and BORDER-BOTTOM are used. It’s really insane. Almost every element of content gets assigned with CLASS=”Normal” and put inside a DIV with a uniqe ID ending with ModuleContent.

All of this rambling led to a cool way to assign CSS properties to certain elements based on Wild Card characters. This only works with Firefox, but if you’re trying get Firefox to display something differently than IE, it can be a big help.

/* all DIV tags with an ID ending in ModuleContent */
div[id$=’ModuleContent’] {
border:2px #000 solid;
}

/* all A tags whose HREF attribute ends in .pdf */
a[href$=’.pdf’] {
border:2px #000 solid;
}

Works great for debugging browser differences as well. Anyway, back to cleaning up the DotNetNuke default.css file. I’ve already got it pared down to 14k (from the original 18k).