I'm currently working on an HTML page, and I've encountered an issue where the browser scrollbar doesn't appear when the content exceeds the browser window. My CSS skills are at a beginner level, so I'm not entirely sure how to add attributes and make them function correctly. For this project, I have mainly utilized W3.CSS and Bootstrap for design purposes. Below is the snippet of HTML code:
<!DOCTYPE html>
<html lang="fa" dir="rtl">
<head>
<title>Dr Salmani</title>
</head>
...
Here's a glimpse into the CSS code that accompanies my project:
.container {
position: relative;
}
body {
height: 100%;
overflow: auto;
box-sizing: border-box;
}
tr,
td {
border-bottom: 1px solid #ddd;
padding-bottom: 15px;
padding-top: 15px;
margin: 50px;
}
...
I've attempted to address the lack of scrollbar by adding height and overflow attributes to the body and HTML elements separately, but it seems ineffective. Interestingly, the scrollbar only appears when I apply these attributes to the main tag specifically. Even trying different browsers hasn't yielded any positive results.