The overflow property tells the browser what to do if the content contained within a box is a larger than the box is larger than the box itself. It can have one of two values:
<h2> Fender Stratocaster </h2>
<p class:"one">The Fender Stratocaster or "Strat" is one of the most popular electric guitars of all time, and its design has been copied by many guitar makers. It was designed by leo... </p>
<h2> Gisbon Les Paul </h2>
<p class:"two"> The Gibson Les Paul is a solid body electric guitar that was first sold in 1952. The Les Paul was designed by Ted McCarty... </p>
This property simply hides any extra content that does not fit in the box.
p.one {
overflow: hidden }
p.two {
overflow: scroll;}
This property adds a scroll to the box so that user scroll to see the missing content.
The Fender Stratocaster or "Strat" is one of the most popular electric guitars of all time, and its design has been copied by many guitar makers. It was designed by Leo...
The Gibson Les Paul is a solid body electric guitar that was first sold in 1952. The Les Paul was designed by Ted McCarty...
On the left, you can see two boxes whose contents expand beyound their set dimensions. The first example has the overflow property with a value of hidden. The second example has the overflow property with a value of scroll.