Back to Web Development
20 Questions Total

Advanced CSS & Responsive Design MCQs

Topic-wise practice questions for Web Development. Test your knowledge, check solutions on demand, and pace your preparation.

Zero-leak answer engine • Rate-limited explanations
Practice in Timed Mode
Q11medium
Which CSS pseudo-class is used to style an element only when the user's mouse is pointing at it?
Q12easy
What is the difference between visibility: hidden; and

opacity: 0;?
Q13medium
You want to position a child element at the absolute center of its parent using Flexbox. Which combination of properties is correct?
Q14medium
In a Grid layout, what does the value grid-template-columns:

1fr 2fr 1fr; achieve?
Q15medium
Analyze this Media Query. When will the background color change to

red?
style.css

@media (min-width: 768px) {
  body { background-color: red; }
}
Q16easy
What is the default alignment of items in a Flexbox container if flex- direction is set to row and no other alignment properties are defined?
Q17easy
Compare @media screen and @media print.
Q18easy
What is the z-index property used for?
Q19easy
In Flexbox, what does the flex-grow: 1; property do?
Q20easy
What is the benefit of using CSS Grid over Flexbox?