0

In my div container, many <p> elements take up so much space, that they leak out of my 'position: fixed;' div element. This is expected, so I want to implement a scroll bar on the right of the div element to help readers scroll down the text.
However, I have no idea how to implement that.

here's what I have:

#rdiv2
{
left:20%;
right:20%;
width:60%;
height:80%;
top:15%;
position:fixed;
}
<div id="rdiv2">
    <article id="article1">
        <h1>Resume</h1>
        <p>Adan Ramirez</p>

        <p>Summary</p>
        <p>Highly dependable, experienced employee and enthusiastic team player dedicated to deliver the</p>
        <p>most out of my employment.  Fluent in English and Spanish.</p>
        <p>Highlights:</p>
        <p>Computer hardware troubleshooting</p>
        <p>1 Year IT Level 1 help desk support</p>
        <p>Network configuring/troubleshooting</p>
        <p>Team Player</p>
        <p>Sociable and willing to work with just about everyone</p>
        <p>CompTIA Security+ Certified-AS in Information Technology 2014</p>
        <p>Windows 7, Dell-OptiPlex Desktops, MS Office, Adobe/Java support</p>
        <p>Experience:</p>
        <p>Spent many years working with technology at home as a passion.</p>
        <p>Currently employed at Oxnard College as IT specialist.</p>
        <p>I get to work with many people in Oxnard College, social skills is what I have.</p>
        <p>I do just about everything in Level 1-2 Tech support</p>
        <p>School internship-Cooperative Work Experience 1.0 Credits, 60 hours were completed:</p>
        <p>I got to install switches and routers in their racks.</p>
        <p>Then we installed power supplies for our switches and routers.</p>
        <p>We also made wall configurations to hang our Ethernet cables.</p>
        <p>Did basic maintenance of the room, such as cleaning, organizing.</p>
        <p>I made RJ-45 cables, tested them, and deployed them.</p>
        <p>I bypassed cisco switches/routers and basic configurations.</p>
        <p>I installed a new image on a PC.</p>
        <p>I installed PSU’s, did some basic maintenance.</p>
        <p>Education</p>
        <p>Oxnard College:</p>
        <p>Associate of Science: Computer Network IT    2014</p>
        <p>Cisco Certificate of Achievement         2014</p>
        <p>Certifications:</p>
        <p>CompTIA Security+</p>

    </article>

</div>

2 Answers 2

2

Add overflow-y: scroll; to the CSS for #rdiv2. The <div> will be then only be as high as the height that you set.

Sign up to request clarification or add additional context in comments.

Comments

0

In your CSS, simply add

overflow-x:scroll;
overflow-y:scroll;

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.