CoreHRx Jobs

Apply in one click, save jobs and take free mock tests.

Register free Log in
Hiring? Post jobs with CoreHRx
My account
user

View & update profile

HTML and CSS mock test: free online practice

15 to 30 random questions in 15 to 30 minutes, by the level you choose: semantics, forms, a11y, specificity, box model, flex, grid, responsive. After you submit you get your score, your strong and weak topics, and the right answer with an explanation for every question.

Want to revise first? Read the HTML and CSS interview questions and answers.

Choose your experience

Free with a CoreHRx Jobs account: you will be asked to sign in or create one first.

What does the HTML and CSS mock test cover?

The test covers 13 topics across three levels. Each attempt picks 15 to 30 questions at random, by the level you choose, so every attempt is different.

  • Performance and Best Practices
  • Selectors and Specificity
  • Cascade and Inheritance
  • Display and Positioning
  • Flexbox
  • Accessibility
  • Forms and Inputs
  • HTML Structure and Semantics
  • CSS Grid
  • Responsive Design
  • Transitions and Animations
  • Box Model
  • Units and Sizing

Sample HTML and CSS mock test questions

One question from each level, the way they appear in the test. A new set comes on the 1st of every month. Try it, then open the answer.

  1. FresherCSS Grid

    What does the fr unit represent in grid-template-columns?

    • A percentage of the viewport width, like vw
    • The width of the widest item in that column
    • A fixed length equal to 16px, the same as 1rem at the default size
    • A share of the space left after fixed tracks and gaps
    Show the answer

    Answer: A share of the space left after fixed tracks and gaps. fr means a fraction of the free space. In 200px 1fr 1fr, the 200px column and the gaps are taken out first and the rest is split in two. Unlike percentages, fr tracks do not overflow because of gaps.

  2. Intermediate (1-5 years)Performance and Best Practices

    The hero banner image is the Largest Contentful Paint element. Which change helps it most?

    • Add loading="lazy" so it does not slow the other images
    • Set it as a CSS background that JavaScript adds after load
    • Use a plain img with fetchpriority high and no lazy loading
    • Convert it to a 4MB PNG so it looks sharper on phones
    Show the answer

    Answer: Use a plain img with fetchpriority high and no lazy loading. The LCP image should be found in the HTML and requested early. fetchpriority high raises its priority, while lazy loading or injecting it with JavaScript delays the request and makes LCP worse.

  3. Experienced (5+ years)Flexbox

    The row has two empty divs. What is the width of each one?

    .row { display: flex; width: 1000px; }
    .row > div { flex: 0.25 1 300px; }
    • 400px
    • 250px
    • 300px
    • 500px
    Show the answer

    Answer: 400px. When the grow factors add up to less than 1 (here 0.5), an item gets only that fraction of the free space, not all of it. Free space is 400px, so each item grows by 0.25 x 400 = 100px to 400px.

Take the full HTML and CSS mock test: 15 to 30 questions and 15 to 30 minutes, by level.

How is the HTML and CSS mock test scored?

A question counts as right only when you pick exactly the right option, or all the right options where it says so; a question left blank counts as wrong. Your score is the share of the test's questions you got right (15 to 30, by level). The result also scores every topic, so you know what to revise before the interview.

  • 75% or more in a topica strength
  • 50% to 74%worth a revision
  • Under 50%a topic to work on

HTML and CSS mock test: questions people ask

Is the HTML and CSS mock test free?

Yes. The HTML and CSS mock test is free. You need a free CoreHRx Jobs account to start it, so your score and the topics to work on are saved.

How many questions are in the HTML and CSS mock test?

It depends on the level: Fresher has 15 questions in 15 minutes, Intermediate has 20 questions in 20 minutes, Experienced has 30 questions in 30 minutes. They are multiple-choice questions picked at random from a larger bank of HTML and CSS questions at your level, so every attempt is different.

Which HTML and CSS topics does the test cover?

The questions cover Performance and Best Practices, Selectors and Specificity, Cascade and Inheritance, Display and Positioning, Flexbox, Accessibility, Forms and Inputs, HTML Structure and Semantics, CSS Grid, Responsive Design, Transitions and Animations, Box Model, Units and Sizing. Your result shows how you did in each topic.

Which level should I choose?

Fresher if you are a student or have less than a year of experience, Intermediate for 1 to 5 years at work, and Experienced for 5 years or more.

Can employers see my HTML and CSS score?

Only your best HTML and CSS score, and only when it is 60% or more. It shows on the job applications you send on CoreHRx. Lower scores stay private.

Can I take the HTML and CSS mock test again?

Yes, up to 10 tests a day. Each attempt picks questions you have not seen recently first.

All mock tests