CSS 3 Tips

While applying CSS to the web page, these 3 steps will might be useful,

css-example
css-example

1. On any given div, if you specify a width, do NOT specify padding or margins (and vice versa). Specify padding and margins on the elements contained in that div instead. Ex: leftcolumn {width:200px} lefcolumn p {padding:10px;width:20px;}

2. Use Firebug and Web Developer Toolbar together. In Firebug, use the inspect button to see element names, styles, and inheritances. Then use Wed Developer’s CSS > Edit CSS panel to change the properties in real time. If anyone wants I can probably make a video screencast and show you some examples of what I mean.

3. Don’t obsess about validation or having perfect code. I know some coding Nazis might hang me for this one, but if you need to stick a clearing div here or use a IE6 hack for a specific issue there, do it. I used to have CSS OCD once too, it’s ok. But if I can save myself an hour of tearing my hair out trying to fix one small issue just in the name of perfect semantic markup – it’s not worth it (especially if your users will never notice or know about it). Life is short. Don’t spend it obsessing about CSS.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: