Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • CSS overflow Property

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 176
    Comment on it

    This property describes what happens when content overflows an element's box.
    In certain cases, a box may overflow and its content may goes partly or entirely outside the box.

    CSS Syntax
    overflow: visible|hidden|scroll|auto|initial|inherit;

    Property Values
    1)visible
    This value indicates that content is not clipped, i.e., it may be rendered outside the block box.
    2)hidden
    This value indicates that the content is clipped and no scrolling user interface is available to view the content outside the clipping region.
    3)scroll
    This value indicates that the content is clipped and that the user can use a scrolling technique which is visible on the screen.
    4)auto
    If overflow is clipped, a scroll-bar is added to see the rest of the content

    Example

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    
        div.scroll {
            background-color: #00FFFF;
            width: 100px;
            height: 100px;
            overflow: scroll;
        }
    
        div.hidden {
            background-color: #00FF00;
            width: 100px;
            height: 100px;
            overflow: hidden;
        }
        </style>
        </head>
        <body>
    
        <p>The overflow property specifies what to do if the content of an element exceeds the size of the element's box.</p>
    
        <p>overflow:scroll</p>
        <div class="scroll">You can use the overflow property when you want to have better control of the layout. The default value is visible.</div>
    
        <p>overflow:hidden</p>
        <div class="hidden">You can use the overflow property when you want to have better control of the layout. The default value is visible.</div>
    
        </body>
        </html>
    

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: