How to create a CSS-only dropdown menu
· HTML & CSS
Build an accessible dropdown menu using only HTML and CSS with the :hover and :focus-within pseudo-classes.
Category: HTML & CSS
60 questions in HTML & CSS.
What are CSS pseudo-elements and how do you use ::before and ::after?
· HTML & CSS
Understand CSS pseudo-elements, how ::before and ::after generate content, and common patterns like decorative icons and clearfixes.
How to use CSS calc() for dynamic sizing
· HTML & CSS
Learn how to combine different CSS units with calc() to create flexible, mathematically precise layouts.
What is the difference between CSS transitions and keyframe animations?
· HTML & CSS
Compare CSS transitions and @keyframes animations to choose the right tool for hover effects, loops, and complex sequences.
How to animate elements with CSS transitions and transforms
· HTML & CSS
Create smooth UI animations using CSS transitions for state changes and transforms for performant movement and scaling.
What are CSS custom properties (variables) and how do you use them?
· HTML & CSS
Learn how to define, scope, and dynamically update CSS custom properties for maintainable and themeable stylesheets.
How to build a responsive image gallery with CSS Grid
· HTML & CSS
Create a responsive image gallery that adapts column count automatically using CSS Grid and auto-fit.
What are CSS media queries and how do you write mobile-first queries?
· HTML & CSS
Master CSS media queries to build responsive designs, and learn why the mobile-first approach is considered a best practice.
How to use CSS position static, relative, absolute, fixed, and sticky
· HTML & CSS
A complete guide to CSS positioning values, their containing blocks, and practical examples for each.
What is the difference between CSS Grid and Flexbox?
· HTML & CSS
Compare CSS Grid and Flexbox to understand their strengths, ideal use cases, and how they complement each other.