CSS Styling

Divi Slider Look: Use Navigation Dots as Text Links

Divi Slider Look: Use Navigation Dots as Text Links

Sliders are known to not be great for conversion so I like to find other uses for them because visuals are so important for so many users. The demo site shows a coming soon example as well as an alternate gallery look, both using the navigation dots as text links to...

Divi Default Header Dropdown Styling

Divi Default Header Dropdown Styling

This code styles dropdown menus on desktop. I'm using the slide effect on the dropdown (in customizer settings) but instead of having it slide in left to right I'm changing it to slide up from the bottom. A bit of space is also added between the header and the...

Divi Gallery Look: First Image Fullwidth with Thumbnail Row Below

Divi Gallery Look: First Image Fullwidth with Thumbnail Row Below

This is a customized look using the Divi gallery module. It makes the first image fullwidth and puts the remaining images in a row of thumbnails below it. A child theme is required to change the image sizes Divi uses for the gallery items. If you don't do that then...

Gravity Forms Plugin Customization with CSS

Gravity Forms Plugin Customization with CSS

If you have a heavily designed website and are using Gravity Forms* chances are a default form will stand out in a negative way. Some CSS can get your form matching the rest of your site so everything looks more cohesive and consistent.   * this is an affiliate...

Center Align Divi Fullwidth Header Buttons on Mobile

Center Align Divi Fullwidth Header Buttons on Mobile

When using the centered fullwidth header module the the alignment of the buttons is off on mobile. This code will fix that.NotesThis post/code is for mobile only. You may need to change the 479px screen size based on your button text.CSS Code