search ]

Posts about: CSS | Page 2

How to Style Scrollbars Using CSS: A Quick Guide

Designing the scrollbars of the browser has become popular lately, and I encounter many websites styling it differently, fitting their overall design and branding. There are several ways to design these scrollbars, and in this post, we’ll see how to [...]

Customization of Underlines using text-decoration

The CSS Text Decoration Module Level 3 module provides us with several new ways to decorate and adorn text on web pages, and browser support for this module is quite extensive, much to our delight. New CSS properties such as [...]

Animating Gradients: A Guide to Smooth Transitions in CSS

In CSS, it is not possible to perform animation or partial gradient changes using the transition property. In other words, the following transition won’t work: .gradient { min-height: 200px; background-image: linear-gradient( to right, hsl(49.68, 97.89%, 62.75%), hsl(200, 51.54%, 44.51%) ); [...]

Troubleshooting position: sticky: Quick Fixes and Solutions

If you are experiencing issues with the position:sticky feature in CSS, meaning it’s not working for you, then the reason is usually one of the following: 1. The feature is not supported by your browser Before proceeding, make sure that [...]

Use CSS Containment & Improve Website’s Performance

CSS Containment is a module that describes a CSS property called contain. This property allows developers to isolate a specific element’s subtree in the DOM and treat it as independent and separate from the rest of the elements in the [...]

A Glance at CSS Mix Blend Modes

According to Wikipedia, merging (or “blending modes”) in digital image editing and computer graphics is used to determine how two layers blend together. In most applications, the default blending mode is simply to hide the bottom layer by covering it [...]

Playing with the background-clip CSS Property

The background-clip property allows us to control how far the background image (or background color) extends beyond the Padding or the content itself of an element. I assume that this explanation is challenging to understand without some examples and a [...]

Separator Line with a Middle Element in CSS

This is a short post describing how to create a separator line with an element in the middle, like a kind of divider with text or an image when there is the same separator line to the left and right [...]

Flex-wrap in CSS: A Practical Guide for Developers

flex-wrap is a specific property that exists as part of the CSS flexbox module. Using this property, you can determine how flex items will be displayed and behave within a flex container when they don’t have enough space. The flex-wrap [...]

Savvy WordPress Development