Overflow Flashcards
What is the purpose of the text-overflow property?
It controls how text fits when it doesn’t fit in the available space within a single unwrapped line.
What are the necessary conditions for using the text-overflow property?
The element must contain a text node, overflow should be hidden, and white-space should be set to nowrap.
How do you prevent text from wrapping when using text-overflow?
Set white-space to nowrap.
What is the purpose of the overflow property in the box model?
It controls how content overflows within an element’s box.
What does the overflow property control in relation to child elements?
It controls how child elements’ content fits into the parent element when the content needs more space than is available.
What does the overflow property affect in terms of layout?
It affects the parent element (a fixed-size window) and its child elements (content that may need more space).
How do you enable scrolling on the vertical axis of an element?
Use the overflow-y property.
How do you enable scrolling on the horizontal axis of an element?
Use the overflow-x property.
What is the purpose of the overflow shorthand property?
It sets both overflow-x and overflow-y properties in one declaration.
What does overflow: visible do?
It is the default value and never hides content, even if it overflows.
What happens when overflow: hidden is used?
Content is clipped in the specified direction, and no scrollbars are shown.
What does overflow: scroll enable?
It enables scrollbars, allowing users to scroll through content.
What is the difference between overflow: auto and overflow: scroll?
overflow: auto shows scrollbars only if needed and hides them by default, while overflow: scroll always enables scrollbars.
What does overflow: clip do?
It clips content to the element’s padding box without showing scrollbars.
