Sunkanmi Fafowora

The CSS border-image-repeat property controls how a border image is repeated to fill the outer edges of an element. It can also control the center of an element’s background when border-image-slice is set to fill.…

The border-image-source CSS property creates borders around elements using an image file or CSS gradient as the source.

.container {
  border-width: 2rem;
  border-style: dotted;
  border-color: grey;
  border-image-source: url('path/to/image.jpg');
  border-image-repeat: repeat;
  border-image-slice: 100;
}

The :auto-fill pseudo-class in CSS allows us to style <input> elements that contain content auto-filled by the browser.

Take a new user registration form as an example. Have you ever clicked or tapped into a field and seen a dropdown …

The ::file-selector-button in CSS is a pseudo-element that selects <input type="file"> in HTML.

input::file-selector-button {
  background-color: #f8a100;
}

You’ve undoubtedly come across file upload inputs — they’re very common, especially for including file attachments in a form, like a PDF …

The :right pseudo-class in CSS is used with the @page at-rule to select all right-hand pages in a print document that contains multiple pages. That’s handy for setting margins on double-sided pages so that the pages on the “right” side …

The :left pseudo-class in CSS is used with the @page at-rule to select all left-hand pages in a print document that contains multiple pages. That’s handy for setting margins on double-sided pages so that the pages on the “left” side …

The :first CSS pseudo-class is used with the @page at-rule to select the first page in a printed document. It’s very similar to the way :first-child selector works to target the first child element in a parent container, but instead …

The print-color-adjust CSS property is sort of like a cost-cutting measure when it comes to printing a webpage. You know how you can literally print a webpage on a piece of paper? That’s what we’re talking about. By applying print-color-adjust…

The CSS break-before property is neat in that it allows, forces, or prevents breaks in paged media, multi-column layouts, and regions. When applying the property to an element, what we’re doing is providing an instruction for whether to break or …

The CSS break-after property is neat in that it allows, forces, or prevents breaks in paged media, multi-column layouts, and regions. When applying the property to an element, what we’re doing is providing an instruction for whether to break or …