Skip to content

Studio N Creations

Nico's Projects & Pro-Tips

  • Home
  • Services
  • Articles
  • Newsletter

Category: CSS

How to fix an Avada background-video not playing on mobile

Posted onOctober 24, 2023 Edit onOctober 26, 2023 by Nico Watine

Here’s why Avada background-videos won’t run on mobile and how to fix the issue

Category :
  • Avada
  • CSS
  • Guide
  • Pro Tips
  • Tutorial Walkthrough
  • Wordpress
Tag : AvadaGoogle ChromeTacupraWeb DevelopmentWeb InspectorWordpress2 Comments on How to fix an Avada background-video not playing on mobile
MD3 box-shadow CSS Feature Image

Material Design 3 box-shadow CSS Values

Posted onMarch 29, 2023 Edit onMay 25, 2023 by Nico Watine

Based on a scss mixin in the official MD3 repo, here are the new elevation shadows in px value

Category :
  • CSS
  • HTML
  • Material Design
  • Responsive Web Design
  • Web Design
  • Web Development
Tag : CSSDiffusion ShadowGoogleMaterial DesignLeave a Comment on Material Design 3 box-shadow CSS Values

Improve link legibility by increasing text-underline-offset

Posted onFebruary 13, 2023 Edit onFebruary 22, 2023 by Nico Watine

Consider overriding default browser anchor underlines by tweaking your CSS styles to improve link recognition

Category :
  • CSS
  • Typography
  • Web Design
  • Web Development
Tag : Good TypographyLink UnderlinesPro TipsWeb BrowsersLeave a Comment on Improve link legibility by increasing text-underline-offset
iOS CSS Phone Links Feature Image

How to style Phone links with CSS on iOS

Posted onJuly 8, 2022 by Nico Watine

Here are 2 methods to override the visual styles that iOS applies to phone links with CSS

Category :
  • CSS
  • iOS
  • Mobile Web Dev
  • Safari
  • Web Development
Tag : CSSHTMLiOS SafariMarkup TechniquesWeb DevelopmentLeave a Comment on How to style Phone links with CSS on iOS
Foundation 6.7.2 safe-padding-inset graphic

How to get safe-padding-inset to work in Foundation 6.7.2

Posted onOctober 12, 2021 Edit onJuly 7, 2022 by Nico Watine

There’s one key step that is easily overlooked. Don’t forget the meta tag!

Category :
  • CSS
  • Web Development
  • ZURB Foundation
Tag : iOS SafariiPhone NotchZURB Foundation 61 Comment on How to get safe-padding-inset to work in Foundation 6.7.2

Categories

  • Alfred 4
  • Alfred 5
  • Apple
  • Avada
  • Branding
  • Business Cards
  • Career Tips
  • Client Testimonials
  • CSS
  • GIF Animations
  • Guest Post
  • Guide
  • Hosting
  • HTML
  • iCloud
  • Industry Advice
  • Industry Theory
  • Internet Browsing
  • iOS
  • Links of the Week
  • macOS
  • macOS Tweaks
  • Macro Reflections
  • Material Design
  • Mobile Web Dev
  • One-Liner
  • Print Project
  • Printers
  • Pro Tips
  • Product Review
  • Project Look-Back
  • Responsive Web Design
  • Safari
  • Sketch App
  • Stationary
  • Sublime Text 3
  • Technology
  • Tools of the Trade
  • Trending
  • Tutorial Walkthrough
  • Typography
  • Web Design
  • Web Development
  • Wedding Programs
  • Wedding Stationary
  • Windows
  • Windows 11
  • Wordpress
  • Writing Techniques
  • ZURB Foundation

Recent Posts

  • New wedding programs printed at OfficeMax came out great
  • How to fix an Avada background-video not playing on mobile
  • How to use Flywheel’s billing transfer feature
  • How to display favicons next to external links in WordPress
  • Material Design 3 box-shadow CSS Values

© Studio N Creations 2024
Home
Articles