It seems that this option is not available in the simulated devices. Tip: If you want to connect the console from your desktop Safari, you will need the Technology Preview. the normal one does not discover the simulator (though it finds the real device normally)
@supports is of no help, see my comment above (hey Apple, can you remind me what was the point of this feature? Sigh) but you can have the same layout with :pseudos and space-between. The only constraint is you can’t use pseudos on the flex container for anything else. ➡️ Codepen ➡️ Relevant code: .evenly-like … Read more
Well, apart from the Error Console that can be opened from the Develop menu (which in turn can be enabled in (Prefences / Advanced / Show Develop menu in menu bar) there aren’t many javascript debugging options in Safari AFAIK. Still, the error console is quite useful as it shows javascript errors and also lets … Read more
Found the solution. In Safari when you use Keyframes you need to use the whole percentage: this won’t work: @-webkit-keyframes keyarm { 0% { -webkit-transform: rotate(0deg); } 5% { -webkit-transform: rotate(-14deg); } 10% { -webkit-transform: rotate(0deg); } } this will: @-webkit-keyframes keyarm { 0% { -webkit-transform: rotate(0deg); } 5% { -webkit-transform: rotate(-14deg); } 10% { … Read more
Safari has an apparent bug where it won’t show some jpg/JPEG images of a certain type in backgrounds if some criteria are met. For online use there is a type of jpg image called Progressive JPEG. Regular jpg images encode the image data from top to bottom, and you can see them load that way … Read more
According to the Apple support forums Safari does not allow you to disable the block on mixed content. Though this is frustrating for usability in legitimate cases like yours, it seems to be part of their effort to force secure content serving / content serving best practices. As a solution for you you can either … Read more
I think I might have found the solution: Apple’s Storage Access API: https://webkit.org/blog/8124/introducing-storage-access-api/
I found a solution that’s working for me in Safari 13.0.2 on macOS Catalina 10.15. The trick was to split position: fixed and overflow: hidden across two divs, like so: <div class=”wrapper”> <div class=”wrap2″> <div class=”inner”> Great success in safari 13.0.2 on MacOS Catalina 10.15 </div> </div> </div> .wrapper{ background-color: red; padding: 40px; width: 200px; … Read more
Hello this question kind of got me at first and I thought back to my days poking around in HTML and CSS for hours on end trying to get things right. Alas all those hours of misery have been for this moment. vh used to be calculated by the current viewport of your browser. If … Read more