• Skip to primary navigation
  • Skip to main content
Sal Ferrarello
  • About Sal Ferrarello
  • Speaking
  • Connect
    Twitter GitHub
You are here: Home / Archives for CSS

CSS

Genesis Child Theme Load style.css with Version Number

Last updated on January 31, 2019 by Sal Ferrarello

How to get your Genesis Child Theme to load style.css with a cache busting ver URL parameter based on the version defined in the header of style.css.

Warning! This is a draft, not a finalized post. See full draft disclosure.

Filed Under: Draft, Programming, Solution Tagged With: cache, CSS, Genesis, WordPress Theme

CSS Pulse Animation

Last updated on September 10, 2018 by Sal Ferrarello

Sometimes it amazes me the powerful things we can do with CSS. Recently, I needed to make an element pulse (i.e. grow and shrink repeatedly). I was able to do this with a few lines of CSS without using any JavaScript.

Warning! This is a draft, not a finalized post. See full draft disclosure.

Filed Under: Dev Tips, Draft, Programming, Solution Tagged With: CSS

Image Opacity Transition Bug

Last updated on August 6, 2018 by Sal Ferrarello

Working on a project, I had an image which faded on hover. a:hover img.fader { transition: opacity 0.5s ease-out; } a:hover img.fader { opacity: 0.5; } I was getting a weird bug where the image would jiggle during the fade. Thanks to this CSS Tricks thread, I learned the problem was that since this image […]

Warning! This is a draft, not a finalized post. See full draft disclosure.

Filed Under: Dev Tips, Draft, Solution Tagged With: CSS

Screenshot of text with padding but image within goes to edge of screen.

Full Screen Width Image Inside Container

Last updated on July 22, 2018 by Sal Ferrarello

Images that appear wider than the text around them are a cool design technique. I do a lot of work with Bootstrap and unfortunately, I’ve found that getting this to work usually ends up with markup that leaves me unsatisfied – at least until now. Using this technique, we can get a full width image without first closing the container element.

Filed Under: Dev Tips, Programming, Solution Tagged With: Bootstrap, CSS

Copyright © 2022 · Bootstrap4 Genesis on Genesis Framework · WordPress · Log in