When I started working on the Force.com platform CSS was an area that made me sad a bit. Deep down. Overriding the Salesforce CSS is a nightmare and I would recommend you don’t begin the dark and daunting journey down that path. Rather start afresh, you’ll thank me later.
That said, dealing with CSS on the platform can still be a timeconsuming task. Especially if you are incorporting images into your pages using CSS. My initial process was something similar to this:
- Create a stylesheet and some styles. Hopefully you’ve done a good job because you have no way of quick-previewing the result.
- Include said stylesheet and all referenced images in a zip file. Take care to preserve the directory structure so that you can reference all stylesheet and image files correctly.
- Upload the zip file as a static resource.
- Create references to the stylesheet in appropriate pages.
- View page. Realise you need to move one of your outputPanels 3px right. Be sad. Deep down. Goto 1.