The colors are mismatched at the top and bottom of each sidebar box. Looks like the color in the middle is lighter.


macOS High Sierra Version 10.13.6
Safari Version 11.1.2
Looks pretty weird on mobile too. (iPhone X, iOS 13.3, Firefox)
I think this is a Safari bug (and on iOS all browsers are actually Safari). caniuse reports "partial support resulting in unexpected behavior with the transparent keyword" which seems like it applies. Unfortunately for Apple, I don't own any of their devices so can't test this which means their users just have to suffer through a worse experience. Evil or Very Mad

Try applying this style to sidebar__section for me to test:
Code:
background: linear-gradient(to bottom, #a2685e 0px, #7b291b 12px), linear-gradient(to top, #a2685e 0px, #7b291b 12px), #7B291B;


If that matches the screenshots I can make that change to work around Safari.
Looked at the site in chrome, looks perfectly fine. Safari has no easily accessible dev tools as far as I know so not sure how to test that.

Edit: wasn't sure about creating another thread but the [say] button in the sidebar sax also overlaps text. looked at it in both safari and chrome, same issue in both browsers
That say button thing isn't new to me, but now that you mention it I have an easy fix in mind; and.. done.

I think I've developed a sufficient understanding of what Safari does wrong to fix it, and verified that the changed version looks the same in my browser so that should be fixed now too.
but now the (say) button overlaps the boder to the right. I won't accept such a useful and practical fix for overlapping text. /s
plz2specify platform, because that shouldn't be possible unless it's doing some nonsense. (Also try clearing your cache?)
Debian, firefox 68.6.0esr, cache clear didn't change anything. My OS and fx profile are old enough that I'd belive that there's weird problems lurking around
The styling looks fine in Safari desktop for me.

Michael2_3B wrote:
Looked at the site in chrome, looks perfectly fine. Safari has no easily accessible dev tools as far as I know so not sure how to test that.


Safari Preferences > Advanced. At the bottom check "Show Develop in menu bar." From there you can plug in your iOS device and it should show up under the Develop menu. I can't get it to show up right now but I've seen my devices show up there.

Edit: You need to also enable "Web Inspector" (located under Advanced) in Safari Settings on the iOS device. My phone nor iPad are showing up so I'm not sure if there's any extra steps I'm missing?
Hooloovoo wrote:
Debian, firefox 68.6.0esr, cache clear didn't change anything. My OS and fx profile are old enough that I'd belive that there's weird problems lurking around
Cool, that's easy enough for me to test myself.

Looks like the default styles make input fields huge but they wouldn't shrink to fit. I've fixed it mostly by removing some pointless styles.
  
Register to Join the Conversation
Have your own thoughts to add to this or any other topic? Want to ask a question, offer a suggestion, share your own programs and projects, upload a file to the file archives, get help with calculator and computer programming, or simply chat with like-minded coders and tech and calculator enthusiasts via the site-wide AJAX SAX widget? Registration for a free Cemetech account only takes a minute.

» Go to Registration page
Page 1 of 1
» All times are GMT - 5 Hours
 
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum

 

Advertisement