www.webdeveloper.com
Results 1 to 8 of 8

Thread: CSS3 - MultiLayered Backgrounds

  1. #1
    Join Date
    Feb 2008
    Location
    San Fernando Valley, California
    Posts
    6

    CSS3 - MultiLayered Backgrounds

    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?

  2. #2
    Join Date
    Feb 2008
    Location
    Göteborg, Sweden
    Posts
    61
    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?

  3. #3
    Join Date
    May 2007
    Location
    Cleveland, OH
    Posts
    1,403
    IE8 is in closed beta currently, according to the ajaxian at least.

  4. #4
    Join Date
    May 2005
    Posts
    2,040

  5. #5
    Join Date
    Feb 2008
    Location
    San Fernando Valley, California
    Posts
    6
    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.

  6. #6
    Join Date
    Jun 2007
    Posts
    183
    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

  7. #7
    Join Date
    Feb 2008
    Location
    Göteborg, Sweden
    Posts
    61
    Another rounded corners resource: http://www.cssplay.co.uk/boxes/snazzy2.html

  8. #8
    Join Date
    May 2007
    Location
    Cleveland, OH
    Posts
    1,403
    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.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles