Tuesday, October 12, 2010

CSS Scrollbars

You can use inline CSS to create your own scrollers through the creation of a smaller box than its contents are defined overflow: scroll This is the equivalent effect of inline frames.

Example
<html>
<head>
<style type="text/css">
.scrollbox {
    display:block;
    width:300px;
    border-width: 2px;
    border-style: solid;
    padding:10px;
    border-color:#000000;
    margin-top:5px;
    height:50px;
    overflow:scroll;
    }
</style>
</head>
<body>
<div class="scrollbox">
Property effluent tells the browser what to do if the contents of the box is larger than the box itself. You can also set to hide hidden content that does not fit in the box and visible to automatically extend the box to fit the contents</div>
</body>
</html>

This result in




Property effluent tells the browser what to do if the contents of the box is larger than the box itself. You can also set to hide hidden content that does not fit in the box and visible to automatically extend the box to fit the contents

No comments:

Post a Comment