Hide browser scrollbars

Question

If I have two DIV's on my webpage which are larger than a browser window, than I have a horizontal scrollbar in my browser.

What should I do to hide this browser scrollbar for the first DIV and not to hide for a second?

Like I have two divs: 200px and 300px width. I want to hide horizontal scrollbar if my browsersize 201-299 px. 250px for example.

How could I ban scroll the browser window if the width 201-299?

Answer 1

You could wrap the two <div>s in a wrapper <div> with min-width set to something acceptable to you:

<style>
div.wrapper {
  min-width: 300px;
}

div.content {
 width: 250px;
}
</style>

<div class="wrapper">
  <div class="content>
  ...
  </div>
  <div class="content>
  ...
  </div>
</div>

This way, the browser will show scrollbars for the wrapper div, but not on the content divs. Is that what you are looking for?