CSS Questions & Answers – CSS Miscellaneous Property

CSS Multiple Choice Questions & Answers (MCQs) focuses on “CSS Miscellaneous Property”.

Q 1. Which of the following CSS property sets the opacity level for an element?
A. transparent
B. transparency
C. opacity
D. all of the mentioned

Show Answer

Answer:-C. opacity

Explanation

The opacity property defines the transparency-level, where 1 is opaque, 0.5 is translucent, and 0 is completely transparent.

Q 2. Which of the following property specifies the order of a flexible item relative to the rest of the flexible items inside the same container?
A. order
B. layout
C. sort
D. asort

Show Answer

Answer:-A. order

Explanation

The CSS order property specifies the order used to lay out flex items in their flex container. Elements are laid out in the ascending order of the order value.

Q 3. Which of the following is an appropriate value for overflow element?
A. hidden
B. auto
C. scroll
D. all of the mentioned

Show Answer

Answer:-D. all of the mentioned

Explanation

Overflow of a div or a container can have the following values: visible|hidden|scroll|auto|initial|inherit.

Q 4. Identify the CSS property that specifies the length of the space used for the tab character.
A. size
B. tab-size
C. tab-space
D. all of the mentioned

Show Answer

Answer:-B. tab-size

Explanation

The tab-size CSS property is used to customize the width of a tab.

Q 5. Which of the following property specifies the stack order of an element?
A. order
B. z-index
C. p-index
D. auto

Show Answer

Answer:-B. z-index

Explanation

The correct option is z-index. It can only be applied on positioned values.

Q 6. Which of the following property allows long words to be able to be broken and wrap onto the next line?
A. line-wrap
B. break-word
C. word-break
D. word-wrap

Show Answer

Answer:-D. word-wrap

Explanation

This property helps you break the words and wrap onto the next line to prevent overflow of div.

Q 7. Which of the following property aligns the flexible container’s items when the items do not use all available space on the main-axis?
A. wrap-content
B. fix-content
C. justify-content
D. adjust-content

Show Answer

Answer:-C. justify-content

Explanation

The CSS justify-content property defines how the browser distributes space between and around flex items along the main-axis of their container.

Q 8. Choose the CSS property which specifies the placement of a table caption.
A. table-caption
B. caption-side
C. cell-caption
D. caption-adjust

Show Answer

Answer:-B. caption-side

Explanation

The caption-side CSS property positions the content of a table’s caption on the specified side.

Q 9. Which of the following CSS property can be used to provide the flex-direction and flex-wrap properties?
A. flex-flow
B. flex
C. flex-wrap
D. all of the mentioned

Show Answer

Answer:-A. flex-flow

Explanation

It is a shorthand for both flex-direction and flex-wrap.

Q 10. Which of the following specifies how much the item will grow relative to the rest of the flexible items inside the same container?
A. flex-scale
B. flex-grow
C. flex-size
D. flex-flow

Show Answer

Answer:-B. flex-grow

Q 11. The writing-mode property primarily affects:

A. The direction of text flow (horizontal or vertical).

B. The font style of the text.

C. The alignment of text within its container.

D. Whether text can be edited.

Show Answer

Answer:-a) The direction of text flow (horizontal or vertical).

Q 12. Which property defines how the browser handles white-space inside an element?

A. word-spacing

B. letter-spacing

C. white-space

D. text-wrap

Show Answer

Answer:-c) white-space

Q 13. What does the scroll-snap-type property do?

A. It determines how elements snap into place when scrolling.

B. It controls the speed of scrolling.

C. It creates a parallax scrolling effect.

D. It defines the scrollbar’s appearance.

Show Answer

Answer:-a) It determines how elements snap into place when scrolling.

Q 14. Which property allows you to control the order of flex items within a flex container?

A. flex-direction

B. flex-wrap

C. order

D. flex-flow

Show Answer

Answer:-c) order

Q 15. What is the purpose of the will-change CSS property?

A. To force a browser to re-render an element.

B. To inform the browser about future changes to an element’s properties, enabling optimizations.

C. To prevent an element’s properties from changing.

D. To animate an element’s properties.

Show Answer

Answer:-b) To inform the browser about future changes to an element’s properties, enabling optimizations.

Q 16. Which CSS property defines the baseline alignment of grid items within a grid container?

A. align-items

B. align-self

C. justify-items

D. justify-self

Show Answer

Answer:-b) align-self

Q 17. The image-rendering property is used for:

A. Specifying how an image should be displayed when it’s scaled.

B. Adjusting the brightness of an image.

C. Applying filters to an image.

D. Defining the aspect ratio of an image.

Show Answer

Answer:-a) Specifying how an image should be displayed when it’s scaled.

Q 18. Which CSS property allows you to specify the minimum number of lines of a block container that must be shown at the top of a page, column, or region?

A. orphans

B. widows

C. line-break

D. page-break-before

Show Answer

Answer:-b) widows

Q 19. What does the tab-size property control?

A. The size of a browser tab.

B. The width of the tab character (\t) when rendered.

C. The size of the text within a tab.

D. The spacing between tab stops.

Show Answer

Answer:-b) The width of the tab character (\t) when rendered.

Q 20. Which CSS property is used to indicate how an element should be sized and positioned within its parent’s content box, particularly in a replaceable element context like <img> or <video>?

A. object-fit

B. object-position

C. background-size

D. background-position

Show Answer

Answer:-a) object-fit