CSS V3 : Multiple Backgrounds

Lets get a few things straight about web design & development.

  1. It’s quite a pain to get things looking correct in all the different browsers.
  2. IE really sucks, all around.
  3. I cannot stand IE.
  4. Some quirks really suck in other browsers also.
  5. see a trend?

Last week Dave Hyatt anounced that since Safari v2.0 it has had the support for multiple background images just as the CSS v3 spec calls for. I em excited about what this makes possible in Safari, but it really puts the rest of the world behind in terms of display properties. I wish I lived in a world where web designers could only design with one browser in mind but this just doesn’t happen. Even on some of the intra-net projects that I have worked on you still have several browsers to contend with. And unfortunatly those are usually ones taht are a little more behind the times compared to Safari.

The question has been out there in the web design world for some time as to wether we should use these cutting edge techniques and just have the display of the web page decay in browsers that don’t support these (prospective) standards or even the confirmed standards that only a select few browsers support. I have elected to allow this to happen on my personal (this site) web site because, as I state in the about page, this is a place that I experiment with different designs and techniques. However, I feel, on any client work, I typically steer away from using these bleeding edge techniques. Instead I shoot for the most commonly supported properties and use several hacks (Filtering CSS
) to siphen out the css that some browsers can’t or won’t handle.

Surfin Safari – Blog Archive – Multiple Backgrounds

WordPress – Highlighting Today

The other day a friend of mine asked me how to have the current date indicated on your WordPress calendar. I realized that I didn’t know and that it was one of the things that I overlooked when I converted over to a WP powered site.

It turns out that it couldn’t be easier. By default WP puts a nice little ID tag in the calendar on the current date. It is declared as id=”today”. From here all you need to do is desccribe how you want it to look in you CSS.

Example:

#today {
	background:#fff;
	color:#000;
}

This will make the table cell of the current date on the calendar have a white background with black text. Use you favorite HEX color conversion utility to find colors that match your site.

HTML js & the WP-admin page

I was a little disapointed to see that in the WP-admin post page there are HTML creating buttons in every browser except Safari. So I did a little digging and found that aparrenly (according to the PHP source) Safari does not support the javascript necessary to preform some of the functions. I dd not accept this as being gospel and went digging through the source a little more and realized that I was over my head trying to fix the javascript. Instead I just edited the browser snifffing code and enabled the HTML functions for Safari. The only real issue seems to be that the cursor does not get inserted back into the correct place. A minor annoyance IMHO. As long as you add your HTML tags as you type. If you add HTML after you type your post this is a little more than annoying, actually it make the feature almost useless and I can understand why Matt chose to use some browser sniffing to hide it from Safari. (Hello, Dave Hyatt? r u listening?)

With that caveat I give you the edited (ok, only needed to remove one character) PHP file for the admin-functions of WordPress. This should be placed in the wp-admin directory. And as always make a backup of the original file (eg: admin-functions.org.php).

Download the PHP file

Note: This applies to the current and previous versions of WordPress ( >= 1.5.1).

Floating Layouts in the Ether

A recent article over at SitePoint about clearing floats (when used in page layout) has drawn some attention in the design community.

I would like to point out as Eric did several months ago that floats were not intended for layout purposes. But they do function within reason. Also that there are some major problems with the vast majority of how browsers display floats. And there are some big limitations in what floats are capable of doing with layout as I have discussed some time ago.

All of that being said, floats have their place in design and they are very handy for layout purposes. But there are problems with using them, and there are problems with using positioning for layout also. There is no easy solution, but there are options. Remember, use the right tool for the right job. There is no wrong way to design.