Jump to content

Modal Window Scrollbar


DancingShrimp

Recommended Posts

Hi folks,

 

I really don't know if this is the right section for posting this question, but perhaps some Moderators could move it otherwise? :) On my website I have a "modal window" which shows a bulleted list of various online stores for digital music. At the moment I have inserted perhaps 100 different stores, and the pop-up box are really long. I need help with creating a fixed size for this window with a scrollbar inside it.

 

CSS part:

.text-box-ul li { list-style-type:disc; margin-left:16px; margin-top:5px; }

HTML part:

<ul class="text-box-ul"><li>Text here</li><li>Text here</li><li>Text here</li><li>Text here</li></ul>

The CSS and HTML-parts are located in different folders on the website structure. I would really appreciate all the help I could get!

 

Thanks!

Link to comment
Share on other sites

Giving a fixed size is as easy as setting the width and height. To give it a scrollbar, set the overflow property to "auto"

.modal {    width: 600px;    height: 400px;    overflow: auto;}
  • Like 1
Link to comment
Share on other sites

You could apply those styles to your list, or wrap the list in another element with those styles applied to it. I just gave the class selector called "modal" so that you know the styles are intended for the modal box. You can put the rules on any element that you want to give a scrollbar to.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...