Controlling the Tap with the Overflow Property

When the content inside a styled tag is larger than the style’s defined width and height, some weird things happen.Fortunately, you can control what a browser should do in this situation with the overflow property. Overflow accepts four keywords that control how content that overflows the edges of a box should be displayed:

• visible. This option is what browsers do normally. It’s the same as not setting the property at all.
• scroll. Lets you add scroll bars .It creates a kind of minibrowser window in your page and looks similar to old-school HTML frames, or the HTML <iframe> tag. You can use scroll to provide a lot of content in a small amount of space. Unfortunately, scroll bars always appear when you use this option, even if the content fits within the box.
• auto. To make scroll bars optional, use the auto option. It does the same thing as scroll but adds scroll bars only when needed.
• hidden. Hides any content that extends outside the box.This option is a bit dangerous, since it can make some content disappear from the page. But it comes in handy for solving some IE browser bugs (see the box on the next page) and is a useful trick for float-based layouts.