How do people have long segmented web pages? [closed] - html

Question

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I apologise in advance if this is a really obvious and noobish question, but how do i segment a web page into multiple portions, with each portion of the webpage filling the screen in it's entirety?
A good example of what i wish to do would be similar to treehouse's homepage when i segment the webpage into multiple portions e.g "home","about us", etc.. I've tried right clicking on the webpage and having a look through the css but did not see height and/or width applied to anything on the page.
How exactly does treehouse, and others segment their webpages?Do they simply make use of a background image or is there some other method of doing so?

Answer 1

When you give the html, body elements a the css property's:
html, body {
height: 100%;
width: 100%;
}
And in your html you makke a couple of div's like this:
<div class="fitScreen">
content 1
</div>
<div class="fitScreen" style="background-color: red">
content 2
</div>
<div class="fitScreen" style="background-color: blue">
content 3
</div>
<div class="fitScreen" style="background-color: yellow">
content 4
</div>
And you give them a css property of height: 100%; They fill the whole screen.
Demo here
EDIT:
Or if you just want 1 element that fills the screen, and all that is beneath that element has a height of auto, just just give make one div with the class of fitScreen.
And beneath that another element with your own content.