Handy CSS tricks, tips from Eric Meyer – Luke W.
In a recent talk at An Event Apart Eric Meyer talked about some of the visual effects we can achieve with CSS today. Here’s a few of them that you’ll find very handy (and some will also improve the user experience):
- If you have a label around a form field, you can add a border and padding. You can omit the ‘for’ attribute when you wrap an input in a ‘label’ element. This makes the entire element clickable not just the radio button but the label too.
- Transforms don’t apply to inline elements. To apply them you need to send display type to inline-block or block.
- A pre-processor like LESS or SASS does not require you to include vendor fixes –it can add them when compiled.
- Font smoothing can be used to lighten up text in Webkit browsers. Use –webkit-font-smoothing: antialiased.
- When you apply styles to form elements, Opera will stop pulling from controls from the operating system and start using it’s own form elements.
Luke Wroblewski has compiled the notes from the talk and the above is an excerpt from his original post, here: http://www.lukew.com/ff/entry.asp?1531