As a newcomer to the world of html and css, I am attempting to construct a reporting page that will showcase various script outputs. However, I am running into an issue where only half of my page is displayed with a scroll bar, whereas I would like the output to be fully visible on the main page without any need for scrolling. Any suggestions on what might be causing this problem or what may be missing?
* {
margin: 0;
padding: 0;
}
html {
background-color: #fff;
color: #555;
font-family: 'Lato', 'Arial', sans-serif;
font-weight: 100;
font-size: 13px;
overflow-y: visible;
}
table { border-collapse: collapse; } td { font-family:Verdana; font-size:11; vertical-align:center; } th { height:7px;font-family:Verdana; font-si
ze:11; font-style:bold; background-color:#81DAF5 }
.firstsec {
margin-left: auto;
margin-right: auto;
padding-top: 0;
overflow-y: visible;
max-width: 1140px;
background-size: 650px;
background-image: url(Backup_logo.jpg);
background-position: center;
height: 20vh;
}
.toptext {
border: 0;
background-color: #5E10B1;
color: white;
width: 25%;
height: 20vh;
font-size: 14px;
text-align: center;
float: right;
}
.logo {
margin: 5px;
width: 22%;
height: 40px;
float: left;
}
.section {
margin-left: auto;
margin-right: auto;
width: 1140px;
overflow-y: visible;
top: 0; right: 0; bottom: 0; left: 0;