Overflow

You will often have copy that does not fit in designs and will need to use overflow to fit the copy properly.

.element {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

Overflow: None

This is a long message that will take up too much space in a design. We need to address this issue otherwise the text will overlap our design and make our application look unprofessional.

Overflow: Hidden

This is a long message that will take up too much space in a design. We need to address this issue otherwise the text will overlap our design and make our application look unprofessional.

You can use overflow to make some interesting designs.

Overflow: None

Overflow: Hidden

Overflow: None

Overflow: Hidden