Skip to content

Lawtec

Sections
Personal tools
You are here: Home Members antonh's Home CSS Buttons
Document Actions

CSS Buttons

by antonh last modified 07-Sep-06 11:48 AM

I just finished updating a site design for a client where I turned a series of buttons, implemented through an image map (obviously the work of a graphic design company) into a series of links with a button image background. Using Plone as my guide, and "this page":http://sophie-g.net/jobs/css/e_buttons.htm , I was able to implement something which looked exactly the same, but which could actually be updated without opening Photoshop :)

And of course I learned a few things about CSS along the way. I always found CSS kind of frustrating because it didn't always do what I wanted, particularly when viewed from a number of different browsers.

A perfect example was getting the text in the middle of the buttons. In my first attempts, I was using the padding tag to achieve this effect. The button was 30 pixels high, the text 9pt, so I was padding 10px on top and bottom. On IE this looked fine, but on Firebird the size of the buttons was now 50px. What I learned is that I am an idiot, and I should have just set the line height at 30px.

The more I learn about CSS the more confident I get. The more confident I get, the more I want to use it to implement a plone site that truly looks different from the default. And I'm starting to think that I can actually do it.

 


This site conforms to the following standards: