CancelImage Upload

How to disable scroll bars on your website with CSS

Previously I have discussed how the horizontal scroll bars of a website can be prevented from appearing using CSS. However, the CSS property overflow can do even more. It can prevent scroll bars from appearing on your website entirely!

body {
overflow: hidden;
}

Here is a more extensive example of how this code combination can be used:

<html>
<head>
<title>How to hide scroll bars using CSS</title>
<style>

body {
overflow: hidden;
}

div {
width:3000px;
height:3000px;
}

</style>
</head>
<body>

<div>Really long and high div.</div>
</body>
</html>

Now that I have presented you with a solution to a "potential" customer requirement I will suggest you think about whether or not it is a good idea to implement it. After all, vertical scroll bars are a vital component of any website, and are needed even on fixed height websites, especially with laptops following the trend of mobile phones, are always getting smaller and smaller. If it is a funny idea that your customer has gotten into his head I strongly advise you talk them out of it.

Login
Want to leave a comment?

No problem. Just enter your email and password below.


register | home | reminder

myDesignTool Networking • www.mydesigntool.cominfo@mydesigntool.com