DigitalOcean and CSS-Tricks logos

CSS-Tricks is powered by DigitalOcean. Make your site part of the leading solution for simple and scalable cloud-based hosting with a free $200 credit to get you started!

Direct link to the article border-image-slice


The CSS border-image-slice tells the browser where to “slice” an image being used to create the pieces of an element’s borders.

.element {
  border-style: ridge;
  border-width: 3rem;
  border-image-source: url('path/to/image.jpg');
  border-image-slice: 30%;
  border-image-repeat: repeat; 

The border-image-slice property is defined in …

Avatar of Sunkanmi Fafowora
Sunkanmi Fafowora on
Direct link to the article :has()


The CSS :has() pseudo-class selects elements that contain other elements that match the selector passed into its arguments. It’s often referred to as “the parent selector” because of its ability to select a parent element based on the child elements …

Avatar of Mojtaba Seyedi
Mojtaba Seyedi on (Updated on )