2

I am working on this page here for a client of mine http://sw6.us/scott/index.html

Notice the site is all based within a div, the problem is the scroll bar that is produced because the text is to long. I have edited my CSS and changed "overflow" to hidden instead of auto but this just makes the text run off the screen and you can not scroll at all.

Here is my refined HTML code

<div class="main">


<div class="blk">
....
</div>
<div class="navbar">
....
</div>
<div class="programs">
.....
</div>
<div class="blk2">
...
</div>


</div>
</body>
</html>

The site is built out of the .main div

How can I make that scroll bar appear at the far right of the browser and scroll the .main div?

If this is not possible how can I achieve this exact look with a set up that will place the scrollbar on the right edge of the browser? The reason I am doing it like this is because the client want's the site looking exactly like his .pdf mock up.

Thanks!

user1067458
  • 117
  • 1
  • 9

2 Answers2

0

If you want to scroll the main div change the CSS as follows...

html, body { overflow: hidden; }
div.main { overflow: auto; }  

You should also set some bottom margin to leave some space for the shadow at the bottom...

Maybe posting the PDF would help better understand for me...

KGB
  • 21
  • 3
0

try this:

<div style="height:250px; width:550px; overflow-x:scroll ; overflow-y: scroll;></div>

And if you want to hide horizontal scroll: overflow-x:hidden ;

Ashwini Verma
  • 7,477
  • 6
  • 36
  • 56