I know this isn’t a new trick but I’ll post it anyway for my own records, and anyone else that may find it useful. As shown below you can add a few lines of code to your stylesheet(s) and get round corners on almost any style element that supports borders.

CSS rounded corners code

.corners {
	-moz-border-radius: 3px;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-webkit-border-bottom-right-radius: 3px;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
	border-bottom-left-radius: 3px;
	border-bottom-right-radius: 3px;
}

As you can see the first line is specifically for Firefox, the next 4 for Safari/Chrome and the last 4 for any browser that fully supports CSS3.

It’s common knowledge that a lot of (most) web/graphic designers uses a Mac. Consequently, they tend to use Mac fonts in their style sheets as their first options (at least quite often). Unfortunately fonts like Lucida Grande, Lucida sans etc. are NOT included in the normal Windows package.

Well know you can get it too! After a bit of googeling I finally found the best emulations of all the OS X system fonts. If you just want to get the emulated Mac Lucida fonts go here.

Later this year Microsoft will release a public version of their next browser. Compared to previous versions Internet Explorer 8 will by default be set to follow web standards rather than “MS standards”. This will create the need for yet another IE fix concerning styling and layout.

The following support article from Microsoft explains how you can add a little code to the file header to keep the old behavior (emulate IE7). You can off course also assume that IE8 will behave like Opera, Safari and Firefox and just keep the rules for older IE versions (I think I prefer the latter if it turns out okay).

You can download and test IE8 Beta here.

Fingers crossed

First let me emphasise that I’m not a big fan of making up different styling rules for the various browsers. But in some (most) cases it’s an absolute necessity.

Before I continue I’d like to mention Dean Edwards IE7 JavaScript library which makes Microsoft Internet Explorer behave like a standards-compliant browser. It fixes many HTML and CSS issues and makes transparent PNG work correctly under IE5 and IE6. That saves you the hassle of making tons of IE specific style sheets and embedding them using these conditional comments (bottom of page).

So with IE out of the way there’s still a few Opera and Safari “bugs” that may need attention. Instead of relying on JavaScript, which will be ignored by some browsers or users that have disabled Java, you may try this PHP approach that I successfully implemented on one of my sites today.

The idea behind this event is to promote Web Standards. Plain and simple. This includes proper use of (x)html, semantic markup, a good hierarchy structure, and of course, a good ‘ol play on words.

To participate you need to remove all CSS from your website, stripping it entirely of its design. However, I only noticed this today (too late for once) so I’ll be in for next year, for sure!

To read more about this initiative, and have a look at how a lot of your fellow bloggers look in the “nude, then you should visit naked.dustindiaz.com