Advertisements
How to Hide the Scrollbar on an HTML Page
Topic: HTML / CSSPrev|Next
Answer: Use the CSS overflow Property
You can simply apply the CSS overflow property with the value hidden on the <body> element to hide scroll bar on an HTML page. However, content will be clipped if necessary to fit the padding box.
Let's try out the following example to understand how it basically works:
Example
Try this code »<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hiding Scrollbar on a Web Page</title>
<style>
body{
overflow: hidden;
}
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eu sem tempor, varius quam at, luctus dui. Mauris magna metus.</p>
</body>
</html>Alternatively, you can hide the horizontal scrollbar by setting the overflow-x property to hidden and the vertical scrollbar by setting the overflow-y property to hidden.
Related FAQ
Here are some more FAQ related to this topic:
- How to set the height of a DIV to 100% using CSS
- How to disable resizable property of textarea using CSS
- How to show hide dropdown menu on mouse hover using CSS
Advertisements
