Skip to main content
Brave Programmer Logo

BraveProgrammer

BraveProgrammer

HomeProjectsBlogsCoursesLessonsAbout

Site footer

BraveProgrammer

Free coding courses, practical tutorials, and real projects from BraveProgrammer. Learn web development with React, Next.js, and TypeScript.

Navigation

  • Home
  • Projects
  • Blogs
  • Courses

Resources

  • About
  • Lessons

© 2026 BraveProgrammer. All rights reserved.

  1. Courses
  2. /
  3. CSS Course

Lesson 25 of 50 · css

CSS Functions – calc(), clamp(), min(), max()

Duration: 8 mins

Functions let you perform calculations directly in CSS.

  • calc() – arithmetic (width: calc(100% - 2rem);).
  • clamp(min, val, max) – fluid values with hard limits.
  • min() / max() – pick the smallest or largest of a list.

Example: Fluid padding with clamp

section { padding: clamp(1rem, 2vw, 3rem); }
Previous: CSS Custom Properties (Variables)Next: Logical Properties & Writing Modes