Overflow
Let's imagine an image with a size of 200x200px (200 pixels wide and 200 pixels high). If we set its parent size to 200x100px (200 pixels wide and 100 pixels high), we say that the image overflows because it is twice as tall as its parent.
We can determine how to handle the overflow. There are 3 basic ways to handle it:
- Hide the overflow:
overflow: hidden - Show the overflow:
overflow: visible- default value - Add scroll for the overflow:
overflow:scroll
Instructions
Add a rule to the paragraph selector (p) that sets the height of paragraphs to 100 pixels.
Notice that the text in the paragraphs overflows.
Add another rule to the paragraph selector that hides the overflow.
Start programming for free
8/9