chacham15
chacham15

Reputation: 14251

Why isnt the background gradient showing up?

I am using tables for positioning, yes...bad I know, BUT there is no other reasonable option for what I want. I have the page partitioned into 3 vertical pieces (top, middle, bottom) and then the middle partitioned into 3 horizontal pieces (left, center, right). While the size of left and right are fixed, they can change. Hence, I run into the different column heights problem. This is further exacerbated by the fact that I want middle to resize to fill the remaining space. The relative/absolute positioning trick doesnt help here and there is no way that static repeating images will work, so I am using tables. The problem is that a gradient in the top piece isnt showing up, why?

JsFiddle demonstrating problem: http://jsfiddle.net/juckh/1/

Upvotes: 0

Views: 49

Answers (1)

Brent
Brent

Reputation: 2971

You have two problems:

First, you need table cells within the table row, your .Window-Top element, to apply the background-image to.

Second, there is currently no browser that supports CSS gradients without browser prefixes.

Fixing these two items fixes the gradient.

http://jsfiddle.net/blineberry/juckh/7/

CSS Gradient browser support: http://caniuse.com/css-gradients

Upvotes: 1

Related Questions