Container queries enable styling based on which container property?

Container queries enable styling based on which container property?

• A. The container's inline size (width)
• B. The container's background color
• C. The container's padding
• D. The container's font family

Answer: (A)

Container queries are about adapting styles based on the size of the container itself. They trigger from the container’s inline size, which in horizontal writing is its width. That’s why styling can change as the container becomes wider or narrower. Other properties like background color, padding, or font family are just styling choices and don’t determine when the query activates. In practice you’d see something like @container (min-width: 40em) { … } to apply styles when the container has at least that width.

Container queries are about adapting styles based on the size of the container itself. They trigger from the container’s inline size, which in horizontal writing is its width. That’s why styling can change as the container becomes wider or narrower. Other properties like background color, padding, or font family are just styling choices and don’t determine when the query activates. In practice you’d see something like @container (min-width: 40em) { … } to apply styles when the container has at least that width.