overflow: hidden clips content beyond the container. overflow: auto shows scrollbars only when needed. text-overflow: ellipsis adds ... to truncated text — also needs white-space: nowrap and overflow: hidden.
Overflow
div {
overflow: visible; /* default — spills out */
overflow: hidden; /* clips content */
overflow: scroll; /* always shows scrollbar */
overflow: auto; /* scrollbar only if needed */
/* Individual axes */
overflow-x: hidden;
overflow-y: auto;
}
/* Truncate text */
.truncate {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis; /* shows "..." */
}