Linear Gradient Problem In Safari -...

User 2699991 Photo


Registered User
5,405 posts

Hi Guys
sorry if this has been covered elsewhere, but i am currently in the wilds of borneo (kalimantan for us) and the internet is so slow I am lucky to get 3 mbs so it would take me all day to search.

My problem is with linear gradient background, I want to do somw on my test site for dark at the top going to lighter at the bottom, (in other words 360)
works fine on all except safari which insists on showing the gradient from datk on the right and light on the left.

Is there a workaround even if it means playing with css a bit (not expert at that but know my way around a little bit)


Thanks all, have a great day wherever in the world you are.
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS


A simple quick way to contact me
https://rsd-tutorialscom.coffeecup.com/index.html
User 10077 Photo


Senior Advisor
1,096 posts

Can you post a link so that we can see it and test it in our browsers?
ASK ME ANYTHING
I provide personalized help for Coffeecup Users including personal or group training for Site Designer, Web Form Builder and more via Zoom.
Email me at support@uscni.org or call 865-687-7698.

Did you know that Web Form Builder can be used for both simple and complicated forms and that it's not limited to the default fonts and buttons? Take a look at a form we developed for WindowTinting.com.
https://forms.windowtinting.com/forms/w … ppingcart/
User 2699991 Photo


Registered User
5,405 posts

try this
http://balismartproperty.coffeecup.com/blank.html
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS


A simple quick way to contact me
https://rsd-tutorialscom.coffeecup.com/index.html
User 232214 Photo


COO
827 posts

All gradients display identical for me in Chrome, Safari and Firefox. If I remember correctly the gradient direction was an issue in older versions of Safari — could that be the case?

I am using 9.0.2 here.
The future of web layout has arrived and it's called CSS Grid. CoffeeCup helps you to get ready with a free guide, the Grid Builder app plus cool demos & themes.
User 2699991 Photo


Registered User
5,405 posts

oooh seems o be that one cannot update safari for windows, so as long as soemone using safari is doing so on an apple machine does it look ok ? if so no worries, i am sure that most of the visitors to our sites don't use safari anyway
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS


A simple quick way to contact me
https://rsd-tutorialscom.coffeecup.com/index.html
User 2699991 Photo


Registered User
5,405 posts

This is a screenshot of what he gradients look like with safari for windows latest and apparently only version.
Attachments:
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS


A simple quick way to contact me
https://rsd-tutorialscom.coffeecup.com/index.html
User 232214 Photo


COO
827 posts

I attached a screenshot for Safari (9) on OSX. I think you'll be liking what you see :P
Attachments:
The future of web layout has arrived and it's called CSS Grid. CoffeeCup helps you to get ready with a free guide, the Grid Builder app plus cool demos & themes.
User 2699991 Photo


Registered User
5,405 posts

Thank You Very Much Bob,
I will continue with the design in the knowledge that all users of safari on OSX will be seeing it as intended/
Tough for those using safari on windows, I might put a pop down/up window on the index page intorming safari for windows users to get a better browser :D
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS


A simple quick way to contact me
https://rsd-tutorialscom.coffeecup.com/index.html
User 232214 Photo


COO
827 posts

Wayanjaya wrote:
Thank You Very Much Bob.

You're welcome!

Wayanjaya wrote:
Tough for those using safari on windows, I might put a pop down/up window on the index page informing safari for windows users to get a better browser :D

:P

Honestly, I would not bother, don't many (any) people would see it ;)
The future of web layout has arrived and it's called CSS Grid. CoffeeCup helps you to get ready with a free guide, the Grid Builder app plus cool demos & themes.
User 489445 Photo


Registered User
2 posts

I am using a PC with Windows 10 and have Chrome, MS Edge, and recently loaded Safari for testing web pages.

I have a vertical gradient as a background that displays properly on Chrome and MS Edge but shows as a horizontal gradient on Safari for windows. Is there a CSS fix to properly display the gradients on Safari for windows?

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.