Remove scrollbars when screen is small

Question

I have been trying to align the div (table) to centre. I changed the margin and the width and it works fine but when the screen is small, I get the scroll down/right bar as shown below :

How can I change that? I tried putting a max-height and playing with the margins (set to 0) but with no success.

HTML :

<div class="container">
<div class="table">
<h3 class="table-title basic-title">####</h3>
<ul class="table-list">
<li></li>
<li></li>
</ul>
<div class="price"></div>
<a class="buy basic" href="#">MORE</a></div>
</div>

CSS :

.container {
  max-height: 465px;
}

.table {
  position: relative;
    width: 50%;
    max-width: 320px;
    min-width: 270px;
    margin: 30px auto;
  background: #fff;
  text-align: center;
  height: auto;
  margin-bottom: 90px;
  -webkit-transition: all .3s linear;
  transition: all .3s linear;
}

Add more css code as by given css we cant make the above given example or try to add jsfiddle. Thank you — Leo the lion, Jul 25 '16 at 11:18

score 1 · Accepted Answer · answered Jul 25 '16 at 11:34

1

You can set overflow to hidden.I think this will remove your problem.

body
{
overflow:hidden;
}

Note: Try overflow.. i think its because of overflow you have been getting the problem.

answered Jul 25 '16 at 11:34

Abhishek

305
2
9

Remove scrollbars when screen is small

1 Answers1