- This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
Viewing 2 posts - 1 through 2 (of 2 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Hello:
I can’t quite figure this one out. I’ve got a background gradient in Firefox which isn’t displaying correctly, but it is in other browsers.
I’m using gradient to make a 2-color background. It intentionally doesn’t look like a gentle gradient but a much more contrasted 2 color split. Using CSS gradients was the only way I could think to do this.
The site is here:
http://testing001.compoundeyedesign.com/
The design should look like this:
https://www.evernote.com/shard/s4/sh/3d2c0e3c-249a-4270-8996-e09143cc1ce9/791f99c8e95434b66c2872c805f018da
However it actually looks like this:
https://www.evernote.com/shard/s4/sh/9f96982e-5826-43b6-97b1-26428b857b3e/a96e63f31cec4d1ea0a0f851a1b9d968
The CSS dictating this background is here:
http://codepen.io/anon/pen/fmtKw.css
.. that CSS includes the other split backgrounds (blue on top, ‘stone’ below) which works perfectly fine in Firefox.
I thought since some sections worked fine in FF, I just had to reverse the color numbers in the CSS. But I don’t quite get how CSS gradient rules work, so I’m not sure what I’m doing.
Any feedback would be welcome.
Cheers, Russell
Or use this…it has all the syntaxes you’ll ever need.