How-to articles, tricks, and solutions about CSS

How to Create Pagination with CSS

Pagination has a greate role in the SEO of your website. Read the article and know how to create standard and beautifully designed pagination with just HTML and CSS.

How to Create Polaroid Image With CSS

Do you want to get '90s vibes with just only CSS? This tutorial is just for you to create a Polaroid image effect for the website. Follow the steps and get examples.

How to Create Search Boxes

Create and style beautiful search boxes without any JavaScript code. Learn the steps to create search boxes and find lots of examples in this tutorial.

How to Create Smooth Scrolling When Clicking an Anchor Link

Read the tutorial and learn information about the two jQuery and JavaScript solutions that are used to create smooth scrolling when clicking an anchor link.

How to Create Stacked Paper Effect

Create an awesome 3D stacked paper effect for your content container. Read the tutorial and find examples!

How to Create Sticky Footer with CSS

A sticky footer is the footer of the web-page which sticks to the bottom of the viewport. In our snippet, you can find different ways of creating a sticky footer.

How to Create Thumbnail Images

If your Website contains lots of images and downloads slowly, read our snippet and learn to create thumbnail images, which will help you to solve this problem.

How to Create Two Fixed Width Columns with a Flexible Column in the Center

In this tutorial, you can find out how to create a Flexbox layout having three columns, two of them with a fixed width and one in the center with a flexible one.

How to Create Two Inline-Block Columns With 50% Width

In this snippet, find out how to create two inline-block columns, both having 50% width and avoid wrapping. You need to use two CSS properties: display and width.

How to Crop and Center Images Automatically in CSS

There are many ways of cropping and centering an image in CSS. Read and find examples with the background-image and object-fit properties, and the <img> tag.

How to Customize File Inputs

It is possible to customize the file input using a <label>. In this snippet, you’ll find the way of customizing the file input without using any JavaScript.

How to Cut Corners With Pure CSS

If you want your Website to look creative, then read our snippet and learn how to get a cut corner effect using different methods and try some examples.

How to Detect Device Orientation with CSS Media Queries

In this tutorial, we are going to discuss the CSS orientation media feature, which helps to detect the screen orientation in CSS. Read and try some examples.

How to Disable Form Fields with CSS

In this tutorial, we’ll demonstrate how it is possible to disable form fields with some CSS. For that, you can use the pointer-events property set to “none”.

How to Disable Links on the Current Page with Pure CSS

Learn how to disable links on the current page using pointer-events and user-select properties. Also, find examples!

How to Disable Text Selection Highlighting Using CSS

Stop being copied by others with just simple and quick technique! Read the snippet and know how to prevent copying from your site disabling text selection highlighting.

How to Disable the Resizing of the <textarea> Element?

Use the CSS3 resize property with its "none" value to disable the resizing function of the textarea element. Learn the ways of only vertically or horizontally resizing, too.

How to Disable Word Wrapping in HTML

In this snippet, we’re going to demonstrate how you can disable word wrapping. For that, use the white-space property either with the “nowrap” or “pre” value.

How to Disable Zoom on a Mobile Web Page With HTML and CSS

One of the most common inconveniences both developers and users face is the zoom on mobile web pages. Well, we’re here to help you fix that problem.

How to Display an Ordered List with Nested Counters

In this snippet, we’re going to show how you can display an ordered list with nested counters by using CSS. See some methods of overcoming this problem.

How to Display Ellipsis in the <span> Element Having Hidden Overflow

In this tutorial, see how to display ellipsis in the <span> element having the CSS overflow property with the “hidden” value. Add the text-overflow property.

How to Display the Hidden Element on Hovering Over Hyperlink or <a> Tag

Learn How to Display the Hidden Element on Hovering Over Hyperlink or <a> tag. With this article, you can learn how to show the hidden elements.

How to Display Unordered List in Two Columns

In this snippet, we’re going to demonstrate how you can display an unordered list in two columns using either the CSS columns or column-count property.

How to Divide a Horizontal Line into Multiple Parts

In this tutorial, you will learn how it is possible to divide an HTML horizontal line into multiple parts. For that, you can use the CSS border-top property.

How to Find an Element by CSS Class Name with XPath

XPath is a syntax helping to find the location of any element using XML path expression. In this snippet, we’ll show how to find an element by class name.