I've been out of the web-dev game for about 2 years now. I did a little reading and experimenting with this last night and had no success at all with giving a single class/id division multiple backgrounds. I tried a basic square division attempting to give it 4 rounded corners and appropriate padding.
Each time I went to add a second background however, everything seemed to stop working browser wise (Firefox/Opera/IE6/SwiftFox all run in Ubuntu:Gutsy).
Did I miss something or is CSS3 not fully a good idea to start building sites by yet?
CSS3 is a bit edgy... IE6 does definitely not know anything about it, and other browser have limited support, unless you go Firefox 3 (beta) or MSIE 8 (are there betas available?). Safari 3 has fairly good support I think. Don't know about Opera.
However, do you mind sharing some code of yours, enlightening your problem?
I was simply going by the rules defined here (http://www.w3.org/TR/css3-background/#layering). I really like the idea of how this would potentially work, it would be extremely useful for writing designs for mobile devices too.
Why do browsers take so long to pick up on this stuff though? The W3C CSS3 working draft was thrown out back in 2005. A 3 year delay between concept and reality in the web development world? It just doesn't seem realistic.
Have you tried this solution to rounded corners I found it on this site a bit ago and it looks like its worth trying at least. It uses no background images: http://www.html.it/articoli/niftycube/index.html
Ugh, all CSS curvy corners are so ugly (not to look at, but I mean look at the CSS/HTML). There's no way I would implement that in a real life scenario, it defeats the purpose of seperating layout and content, you might as well use tables at that point.
I'd rather just use a background-image solution, or when needed a javascript solution that will degrade nicely (to square corners) like this one.
Bookmarks