I just recently started coding and so I'm not particularly sure of a lot of things - even what program I'm using. What's the difference between HTML and CSS?
Anyway, back to the question at hand: How do I make a certain section of a page fit 100% of the screen in all resolutions, yet keep the ability to scroll down? This is the website: http://youns.gitastudent.online/
I'm trying to make it so that the 'Computer Science: Gita 1' box is centered on the page for all resolutions, but the scroll function is still there. The button below will scroll the page down to the 'August' heading, should a user click on it.
I also have another button at the very bottom of the website that brings the page back up to the top, but I noticed that it never truly brings it all the way up. I can still scroll up maybe 5-10 pixels - is there a reason for this? How do I fix this?
<div class="main" id="Top"></div>
</br></br></br></br></br></br>
<hr width="90px" size="1" color="silver">
<hr width="200px" size="1" color="silver">
<hr width="525px" size="1" color="silver">
<div id="box1" class="Style7">
. . .
</div>
<h1 id="box2"></br>Computer Science: Gita 1</h1>
<div id="box2" style="line-height:20px">
</br>
</div>
<div id="box2" class="Style2">
This is my website for Computer Science 1. We are learning C#</br>which is used for making Windows apps.
This is my first year of programming, but</br>some day I would like be able to program my own apps from scratch.
</div>
<div id="box3" class="Style2">
</br>
</div>
<div id="box4" class="Style7">
. . .
</div>
</br>
<hr width="525px" size="1" color="silver">
<hr width="200px" size="1" color="silver">
<hr width="90px" size="1" color="silver">
</br></br></br></br></br></br>
<div class="Style2">
Projects
</div>
<div class="Style6">
-
</div>
<div><a href="#Projects"><button class="button1">﹀</button></a></div>
</br></br></br></br></br>
<div id="Projects"></div>
<div id="box6" class="Style4" align="center">
</br>
August
</br>
</br>
</div>
</br></br>