Reputation: 14251
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
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