Customize CSS for Views

This is the easy way. Tomorrow, i’ll tackle the hard way.

Copy the Views.css file from the modules/views/css dir and paste it into the CSS folder of your Subtheme. Do use a subtheme, that way you can upgrade the core theme using someone else’s work.

Edit the themename.info file of your subtheme and add the reference to the copied CSS file. Mine looks like this:

;———-// Stylesheets

; See each stylesheet for extensive documentation and help.
stylesheets[screen][] = css/global.base.css
stylesheets[screen][] = css/global.styles.css
stylesheets[screen][] = css/views.css

; Print – uncomment to load basic print styles.
; stylesheets[print][] = css/print.css

then use Firebug to check one of the selectors that was coming from the default Views.css file. The path should now point to the new one. Now you can style your Views using custom CSS. Here is a good link. Tomorrow, i’ll do this via the .tpl file via a function. Much more efficient. But harder to implement. Good thing I am a sadomasochist. At least as far as IT goes. 😉