Guides · page 6 of 14
Browsing 320 guides, newest first.
CSS Flexbox: Complete Guide to flex-direction, justify-content, and align-items
Flexbox aligns items in one dimension, a row or a column. Here's how flex-direction, justify-content, align-items, flex-grow, and the other Flexbox properties work with visual...
Fluid Typography with CSS clamp(): Scale Fonts Without Media Queries
CSS clamp() creates fluid typography that scales smoothly between minimum and maximum font sizes without media queries. Here's how to write fluid type scales, calculate clamp()...
CSS Grid Template Areas: Named Grid Areas Explained
CSS grid-template-areas lets you name regions of your layout and assign elements to them visually. Here's how to define named grid areas, assign elements, and build full page...
CSS Grid Auto Placement: How grid-auto-flow Works
CSS grid auto-placement automatically positions items in the grid without explicit placement rules. Here's how grid-auto-flow, grid-auto-rows, and grid-auto-columns work, and...
CSS Grid Browser Support: What Works Where in 2025
CSS Grid has near-universal browser support as of 2025. Here's what's supported everywhere, what features need prefixes or workarounds, and how to progressively enhance layouts...
CSS Grid Gap: Spacing Between Grid Items
CSS grid's gap property (formerly grid-gap) adds spacing between rows and columns without affecting outer edges. Here's how gap, row-gap, and column-gap work, plus techniques...
CSS Grid Layout: How to Build Two-Dimensional Layouts
CSS Grid creates two-dimensional layouts with explicit rows and columns. Here's how grid-template-columns, grid-area, auto-fit, and minmax work with practical patterns.
CSS Grid Lines: Placing Items with Line Numbers and Names
CSS grid lines are the dividers between tracks. You can place items using line numbers (1, 2, -1) or named lines. Here's how grid line placement works with grid-column,...
CSS Grid minmax(): Flexible and Responsive Grid Tracks
CSS grid's minmax() function sets a minimum and maximum size for grid tracks. Combined with repeat() and auto-fill, it creates responsive grids without media queries. Here's...
CSS Grid Template: Build Grid Layouts with grid-template-columns and Rows
CSS Grid's grid-template-columns and grid-template-rows define the structure of a grid layout. Here's how to use fr units, repeat(), minmax(), and named lines to build...
CSS Grid vs Flexbox: When to Use Each Layout System
CSS Grid and Flexbox solve different layout problems. Grid is for two-dimensional layouts; Flexbox is for one-dimensional alignment. Here's when to use grid vs flexbox, with...
CSS Units Guide: px, em, rem, vw, vh, and When to Use Each
CSS has absolute units (px), relative to font-size (em, rem), viewport units (vw, vh, dvh), and container query units (cqw). Here's when to use each unit and common patterns...
CSV Format Guide: Structure, Delimiters, and Common Parsing Issues
CSV (Comma-Separated Values) is a simple tabular text format. Here's the RFC 4180 standard, delimiter variations, quoting rules, and how to parse CSV correctly in code.
CSV vs JSON: When to Use Each Data Format
CSV is ideal for tabular data with tools like Excel and pandas. JSON handles nested, hierarchical data. Here's when to choose CSV vs JSON for data exchange, APIs, and storage.
Date to Unix Timestamp: Convert Any Date to Unix Time
Converting a date to a Unix timestamp gives you the seconds since January 1, 1970 UTC. Here's how to convert dates to timestamps in JavaScript, Python, SQL, and why timezone...
Decimal to Binary: How to Convert Numbers Between Bases
Decimal to binary, binary to decimal, hex to binary, number base conversion explained step by step. Includes conversion tables, formulas, and code examples.
Detecting Changes in JSON Data: Audit Logs, Diffs, and Change Tracking
Detecting what changed in a JSON document is essential for audit logs, versioning, and syncing. Here's how to track JSON changes with diff algorithms, store change history, and...
Device Type Detection: Mobile, Tablet, Desktop in JavaScript
Detect whether a user is on mobile, tablet, or desktop using user agent strings, CSS media queries, and pointer media features. Includes reliable JavaScript methods and...
Diff Algorithm Explained: How Text Comparison Tools Work
Text diff tools use the LCS (Longest Common Subsequence) or Myers diff algorithm to find minimal edits between two texts. Here's how diff algorithms work and how to use them in...
Understanding Merge Conflicts: How 3-Way Diff Works
Merge conflicts occur when two branches edit the same lines differently. Learn how 3-way diff detects conflicts, what conflict markers mean, strategies for resolving conflicts,...
drop-shadow vs box-shadow in CSS: Which to Use and When
CSS has two shadow properties: box-shadow on the box model and filter: drop-shadow() that follows the element's actual shape. Learn the differences, performance tradeoffs, and...
Dynamic QR Code vs Static QR Code: What's the Difference?
Dynamic QR codes use a redirect URL that can be changed after printing. Static QR codes encode the destination directly. Here's when to use each and what dynamic codes offer.
Email Extractor in Python: regex, html.parser, and BeautifulSoup
Extract email addresses from plain text, HTML pages, and files using Python. This guide covers regex patterns, BeautifulSoup scraping, bulk file scanning, and validation to...
Email Regex Validation: How to Validate Email Addresses
Email validation with regex catches most invalid addresses but can't verify deliverability. Here's the right regex for email validation, edge cases to handle, and why you...