My favorites | Sign in
Project Logo
Project Home
  
Wiki
  
Issues
  
Source
    
Search
for
Updated Sep 19, 2008 by pilgrim
Labels: about-css, is-css-property, from-w3c
OverflowCSSProperty  
The overflow property specifies whether content of a block-level element is clipped when it overflows the element's box.

You are here: Home > CSS Reference > Properties > overflow

Usage

overflow: auto or overflow: hidden will force a container to expand to encompass its contents. Be careful with dynamic content (such as Javascript menus), because they might be clipped.

Values

Browser compatibility

Compatibility table legend

Test IE8 IE7 IE6 FF3 FF2 Saf3 Op9 Chrome
style.overflow reflects <div style='overflow: -moz-scrollbars-horizontal'> N N N N N N Y N
style.overflow reflects <div style='overflow: -moz-scrollbars-none'> N N N N N N Y N
style.overflow reflects <div style='overflow: -moz-scrollbars-vertical'> N N N N N N Y N
style.overflow reflects <div style='overflow: auto'> Y Y Y Y Y Y Y Y
style.overflow reflects <div style='overflow: bogus'> Y Y Y Y Y Y Y Y
style.overflow reflects <div style='overflow: hidden'> Y Y Y Y Y Y Y Y
style.overflow reflects <div style='overflow: scroll'> Y Y Y Y Y Y Y Y
style.overflow reflects <div style='overflow: visible'> Y Y Y Y Y Y Y Y

Further reading

Comment by lrivers, May 19, 2008

overflow: auto or overflow: hidden will force a container to expand to encompass its contents. Be careful with dynamic content (such as javascript menus) because they might be clipped. Very useful for working around IE display bugs as well.

Comment by yangxiao...@gmail.com, Oct 21, 2008

Chrome can't read overflow property. What's wrong with my code? <html> <head></head> <body> <div id="test" style="overflow:hidden;"> test </div> <script> alert(document.getElementById('test').style.overflow); </script> </body> </html>


Sign in to add a comment
Hosted by Google Code