0

I am not sure how to exactly phrase this question so maybe that's why I can't find help with this.

I am coding a webpage and the designer has made a background for a part of it. It's sort of a two way gradient: both horizontal and vertical at the same time. I am attaching the image here because I'm not sure how to explain it.

I'm sorry if it's very obvious but I can't find anything resembling this anywhere. Thank you! Here's the image: two-way gradient

EDIT: The question is, can I make this background using just CSS3? Thanks!

Riki
  • 38
  • 5
  • I'm not really sure what the question is. You never ask one. – MrDanA Jul 31 '11 at 04:32
  • I just edited the post. Thanks MrDanA, I try so hard not to ask stuff that when I actually do I forget to post the real question =) – Riki Jul 31 '11 at 04:51

1 Answers1

3

Are you able to limit browser support to browsers that support multiple backgrounds?

If so, you can create two gradients, along with a border, to simulate that.

Here's a version that only works in Firefox: http://pastehtml.com/view/b295elnso.html

You can modify the webkit and other lines to get it working in other browsers. I used the Ultimate CSS Gradient Generator to build the lower gradient.

Here's a good listing of multiple background support.

(Edit: I meant only works in Firefox, not IE. Doh!) *(Edit2: Added multiple background support listing)*

OverZealous
  • 39,252
  • 15
  • 98
  • 100
  • I didn't know you could use multiple backgrounds. Browser support is not a big deal since it doesn't really matter that much if I get a plain background in a different browser. Thanks a lot!! – Riki Jul 31 '11 at 05:46