When content overflows an element's box, the overflow attribute indicates what should happen. When an element's content is too large to fit in a defined area, this attribute determines whether to clip it or add scrollbars. The overflow property is only applicable to block elements with a specified height.
The text-overflow attribute specifies how the user should be notified of overflowed content that isn't being shown. It can be trimmed, have an ellipsis (...), or have a custom string displayed.
The text element must first overflow in order to use the text-overflow attribute. This can be accomplished by setting white-space: nowrap to prevent the element from wrapping the overflowing content to a new line. In addition, overflow must be turned off.
It can take one of four values: The default value of the overflow attribute is visible, which displays the overflowing content without any adjustments. Hidden: The overflowing material is hidden. Scroll: Allows you to see the overflowing (hidden) information by adding vertical and horizontal scroll bars.
Even when scrollbars are required, overflow:hidden stops them from appearing. The following is an explanation of your CSS: The element is horizontally aligned at the centre with margin: 0 auto. Scrollbars are not displayed when overflow:hidden is used.