Intermediate CSS Quiz

#1 Which of the following doesn’t create a stacking context?

mix-blend-mode:normal;

mix-blend-mode:overlay;

transform:translate(10px);

transform:translate(0);

#2 In CSS grid how to create a layout with 3 equal columns?

grid-template-columns: 1fr 1fr 1fr;

grid-template-columns: auto auto auto;

grid-auto-columns: 1fr;

grid-template-columns: auto;

#3 Which of the following is an invalid value of the filter property?

filter:gray(50%);

filter:opacity(80%);

filter:saturate(50%);

filter:invert(1);

#4 width:calc((100% + 10px) – 10%) is the same as

width:calc(90% + 10px)

width:calc(100% + 9px)

width:calc(90% + 9px)

it's invalid

#5 The line-height value can be specified inside the font property.

false

true

#6 How to select all the div elements with a class “a” and without a class “b”?

div:has(.a):not(.b)

div.a

div.a:not(.b)

div:not(.b)a

#7 In CSS grid how to make all the rows equal in height?

grid-auto-rows:repeat(auto-fit,1fr);

grid-auto-rows:1fr;

grid-template-rows:repeat(auto-fit,1fr);

grid-template-rows:1fr;

#8 Which of the following is an invalid unit?

ch

vm

ex

pc

#9 The containing block of position:absolute is established by the nearest ancestor with position:relative

true

false

#10 In CSS grid how to set a distance of 10px between all the columns?

grid-gap:10px 0;

column-gap:5px;

grid-gap:5px 5px;

column-gap:10px;

#11 Which of the following is not a transformable element?

replaced inline-block element

replaced inline element

non-replaced inline-block element

non-replaced inline element

#12 100vmin is always smaller than 50vh

false

true

#13 What is the default value of flex-shrink?

0

1

none

auto

#14 What is the default value of flex-grow?

none

1

auto

0

#15 An element with a positive z-index will always be on the top of an element with a negative z-index

false

true

#16 100vmax is always bigger than 50vw

true

false

#17 Which of the following will NOT show a border?

border:2px solid;

border:solid;

border:thick;

border:dashed;

#18 Which selector has the lowest specificity?

input:first-of-type

div > form input

input.submit

form > input[type="submit"]

#19 Which of the following is an invalid CSS property?

grid-template

grid-row

grid-auto-flow

grid-auto-row

#20 How to remove line breaks within text?

white-space:no-wrap;

whitespace:no-wrap;

white-space:nowrap;

whitespace:nowrap;

Intermediate CSS

#1 Which of the following doesn’t create a stacking context?

#2 In CSS grid how to create a layout with 3 equal columns?

#3 Which of the following is an invalid value of the filter property?

#4 width:calc((100% + 10px) – 10%) is the same as

#5 The line-height value can be specified inside the font property.

#6 How to select all the div elements with a class “a” and without a class “b”?

#7 In CSS grid how to make all the rows equal in height?

#8 Which of the following is an invalid unit?

#9 The containing block of position:absolute is established by the nearest ancestor with position:relative

#10 In CSS grid how to set a distance of 10px between all the columns?

#11 Which of the following is not a transformable element?

#12 100vmin is always smaller than 50vh

#13 What is the default value of flex-shrink?

#14 What is the default value of flex-grow?

#15 An element with a positive z-index will always be on the top of an element with a negative z-index

#16 100vmax is always bigger than 50vw

#17 Which of the following will NOT show a border?

#18 Which selector has the lowest specificity?

#19 Which of the following is an invalid CSS property?

#20 How to remove line breaks within text?

Your Result