HTML Questions & Answers – Styling HTML5 Layout with CSS

This set of HTML Multiple Choice Questions & Answers (MCQs) focuses on “Styling HTML5 Layout with CSS”.

1. Which of the following works as a sidebar?
a) <aside>
b) <footer>
c) <details>
d) <section>
View Answer

Answer: a
Explanation: <aside> defines content aside from the content like a sidebar, <footer> defines a footer for a document or a section, <details> defines additional details, <section> defines a section in a document.

2. Which of the following can’t be the value of float property?
a) left
b) right
c) center
d) inherit
View Answer

Answer: c
Explanation: float property can have the property left, right, none, inherit. When set to inherit value the element inherits the float value of its parent, when set to none property the element does not float, it is the default value.

3. Which of the following can’t be the value of a clear property?
a) left
b) inherit
c) right
d) center
View Answer

Answer: d
Explanation: clear property specifies what elements can float beside cleared element and on which side. It can hold the values none, left, right, both and inherit. The inherit property inherits the clear value of its parent when setting to both no floating elements allowed on either the left and right side.
advertisement
advertisement

4. Which of the following specifies what happens if content overflow an element’s box?
a) overflow
b) overflow-x
c) overflow-y
d) float
View Answer

Answer: a
Explanation: overflow property specifies what happens if content overflows an element’s box, overflow-x specifies what to do with left/right edges of the content if it overflows the element’s content area, overflow-y specifies what to do with top/bottom edges of the content if it overflows the element’s content area.

5. Which of the following was not previous layout mode?
a) Block
b) Flexbox layout
c) Inline
d) Positioned
View Answer

Answer: b
Explanation: Before Flexbox layout module there were four layout modes. Block, Inline, Table, Positioned. Block is for sections in a webpage, inline is for text, table is for two dimensional table data, positioned is for explicit position of an element.
Note: Join free Sanfoundry classes at Telegram or Youtube

6. Which property defines in which direction the container wants to stack flex items?
a) flex-flow
b) flex-wrap
c) flex-direction
d) align-content
View Answer

Answer: c
Explanation: flex-direction property defines in which direction the container wants to stack the flex items, the flex-flow property is shorthand property for setting both flex-direction and flex-wrap properties. For deciding whether the flexible items should wrap or not, flex-wrap property is used.

7. Which property is used to align flex items?
a) align-items
b) justify-content
c) align-content
d) flex-grow
View Answer

Answer: b
Explanation: justify-content property is used to align flex items, the align-items property is used to align flex items vertically, the align-content property is used to align flex lines, flex-grow specifies how much a flex item will grow relative to rest of flex items.
advertisement

8. Which of the following specifies initial length of flex item?
a) flex-flow
b) flex-grow
c) flex-shrink
d) flex-basis
View Answer

Answer: d
Explanation: flex-basis property specifies the initial length of the flex item, flex-shrink property specifies how much a flex item will shrink relative to rest of flex items, the value must be a number and a default value is 1. The flexible-grow property is a relative comparison between the items. It decides how much item will grow relative to the rest of flexible items inside the same container.

9. Which of the following overrides container’s align-items property?
a) order
b) align-self
c) align-items
d) flex
View Answer

Answer: b
Explanation: align-self property is used on flex items, it overrides container’s align-items property, flex is shorthand property for flex-grow, flex-shrink, and flex-basis properties, the order specifies the order of flexible item relative to rest of the flex items inside the same container.
advertisement

Sanfoundry Global Education & Learning Series – HTML.

To practice all areas of HTML, here is complete set of 1000+ Multiple Choice Questions and Answers.

advertisement
advertisement
Subscribe to our Newsletters (Subject-wise). Participate in the Sanfoundry Certification contest to get free Certificate of Merit. Join our social networks below and stay updated with latest contests, videos, internships and jobs!

Youtube | Telegram | LinkedIn | Instagram | Facebook | Twitter | Pinterest
Manish Bhojasia - Founder & CTO at Sanfoundry
Manish Bhojasia, a technology veteran with 20+ years @ Cisco & Wipro, is Founder and CTO at Sanfoundry. He lives in Bangalore, and focuses on development of Linux Kernel, SAN Technologies, Advanced C, Data Structures & Alogrithms. Stay connected with him at LinkedIn.

Subscribe to his free Masterclasses at Youtube & discussions at Telegram SanfoundryClasses.