DevStudio

Text & Code

Diff CheckerJSON BeautifierJWT ToolsEncoder / DecoderEncrypt / DecryptJS Playground

Files

Image EditorPDF Editor & Merger

Network

Webhook TesterSSH Manager

Databases

MySQLPostgreSQL

Communication

Email ToolTemp Mail

Utilities

Lat/Long PickerNotes & Docs

Learn

GuidesArticles

Games

Games
Sign in

CSS Articles

All articles

Pseudo-classes vs Pseudo-elements in CSS

A pseudo-class (:hover) targets an element in a certain state; a pseudo-element (::before) targets a sub-part of an element that doesn't exist in the DOM.

em vs rem in CSS — What's the Difference?

em is relative to the current element's font size (and compounds through nesting); rem is always relative to the root element's font size.

How to Center a Div in CSS (All the Ways)

Center an element horizontally, vertically, or both using Flexbox, Grid, margin auto, or absolute positioning — with the tradeoffs of each approach.

The CSS Box Model Explained: Content, Padding, Border, Margin

Every element in CSS is a box made of content, padding, border, and margin. Learn how box-sizing changes what 'width' actually measures.

How CSS Specificity Works (And Why Your Style Isn't Applying)

CSS specificity determines which rule wins when multiple selectors target the same element. Learn the calculation and how !important overrides it.

CSS Flexbox vs Grid — When to Use Each

Flexbox lays out items along a single axis; Grid lays out items in two dimensions (rows and columns). Learn which layout model fits which situation.