Creating scroll bar within page using CSS?

  • SB
  • Moderator
  • Genius
  • User avatar
  • Posts: 8742
  • Loc: Aberdeen, Scotland

Post 3+ Months Ago

I know it is possible, however not entirely sure if it is CSS related or not.

How would i go about creating a scroll bar on content within a page?

This is the box in which i'd like there to be a scrollbar...

Code: [ Select ]
#contentbox {
    width: 260px;
    height: 260px;
    overflow: auto;
    position: absolute;
    margin-left: -605px;
    margin-top: -157px;
    text-align: justify;
    padding-right: 1em;
    padding-left: 1em;
    background: #000;
    filter:alpha(opacity=50);
    -moz-opacity:0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
}
  1. #contentbox {
  2.     width: 260px;
  3.     height: 260px;
  4.     overflow: auto;
  5.     position: absolute;
  6.     margin-left: -605px;
  7.     margin-top: -157px;
  8.     text-align: justify;
  9.     padding-right: 1em;
  10.     padding-left: 1em;
  11.     background: #000;
  12.     filter:alpha(opacity=50);
  13.     -moz-opacity:0.5;
  14.     -khtml-opacity: 0.5;
  15.     opacity: 0.5;
  16. }
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • Bigwebmaster
  • Site Admin
  • Site Admin
  • User avatar
  • Posts: 9089
  • Loc: Seattle, WA & Phoenix, AZ

Post 3+ Months Ago

The key parts if I recall is to have a fixed height and to set the overflow to auto. It will only appear if you have enough content in that area to actually be overflowing out of the fixed space. Looking at your CSS I would think it would already work, just make sure you have enough stuff in that area using that class so that it is needing to show a scrollbar because there is not enough room to display it all.
  • SB
  • Moderator
  • Genius
  • User avatar
  • Posts: 8742
  • Loc: Aberdeen, Scotland

Post 3+ Months Ago

:lol:

Thanks.

Turns out that all i really needed to do was put in more content. Scroll bar appeared automatically as you said.

Thanks Brian.

Post Information

  • Total Posts in this topic: 3 posts
  • Users browsing this forum: No registered users and 82 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.