Adding Vertical Scrollbar in Paragraph inside Div

Question

I have a paragraph inside the Div .Now the contents of the paragraph are getting increased as i have planned to add some images but my div has a fixed height of 600px; and so my paragraph so if veritical scrollbars gets added for my paragraph then it would solve my issue..

Here is the HTML for my layout..

 <div id="bodydesc" style="margin-left:auto; margin-right:auto; width:960px; height: 600px;">

            <p id="desc" style="float:left;color: #666666; width:700px; font-family: Candara,Trebuchet MS,sans-serif; font-size: 12px; font-weight: bold; border-right: thin dotted #666666; line-height: 18px;">

              //Here is my large content with images...

            </p>

 </div>

So my question is how can i get vertical scrollbar in paragraph inside the div in HTML ... Please help me .. Thanks in advance..

Answer 1

Short and quick answer, add a scrollbar to the #bodydesc by adding overflow-y to the style attribute:

<div id="bodydesc" style="margin-left:auto; margin-right:auto; width:960px; height: 600px; overflow-y: scroll;">

    <p id="desc" style="float:left;color: #666666; width:700px; font-family: Candara,Trebuchet MS,sans-serif; font-size: 12px; font-weight: bold; border-right: thin dotted #666666; line-height: 18px;">

      //Here is my large content with images...

    </p>

</div>

The front end developer that is in me insists that I tell you to move all those style declarations in an external css file.

Answer 2

add overflow-y: scroll; to your paragraph

Answer 3

add this to your element:

overflow-y:auto;

Answer 4

Fix the paragraph height with the appropriate height:...px and add overflow-y: auto;