Reputation: 618

<html> doesn't stretch the entire page

I have been making a website and it had been working fine till I tried to add some in-page links (it's a pretty big page). And so I did that, and then the background wouldn't stretch the entire length of the page. So I would scroll down, and the <body> tag that was imbedded in the <html> tag covers the correct amount on my computer screen, but not the page. The reason I know it is the <html> tag is that when inspecting the page, it shows the <html> tag just ending. So then I deleted what I had done and the problem is remaining for some reason. If you need some more information like the .css or the coding, just tell me. Thanks for the help.

Here's some code to help. I only put the content up to where the tag stops.

<link rel="stylesheet" type="text/css" href="http:**********/index.css>     
<title>School</title>
<div id="containerSchool" class="GenericContainerProperties1">
<div id="SchoolHeading1" class="GenericHeaderProperties1">
<span id="spanid1" class="spangroup1" ><a class="linktype1"href="***********">Home</a>
</span>
<span id="spanid2" class="spangroup1" ><a class="linktype1"href="*****/school/login.html">School</a></span>
<span class="spangroup1" ><a class="linktype1"href="**********/Testing/page.html">Testing</a></span>
</div>
<div id="SchoolBody1">
<p style="font-size:40px;text-align:center"><b>School</b></p>
<body>
<hr class="SchoolHrGroup1">
<p>Biology</p>
<table border="1" align="center">
<tr>
<td>Title</td>
<td>Link</td>
<td>Date Added</td>
<td>Latest Version</td>
<tr>
<td>Semester 1 Laps</td>
<td><a href="*******">0</a></td>
<td>N/A</td>
<td>Yes</td>
<tr>
<td>Lap I Notes</td>
<td><a href="********"target="new">1</a></td>
<td>N/A</td>
<td>Yes</td>
<tr>
<td>Lap II Notes</td>
<td><a href="*********" target="new">0</a></td>
<td>N/A</td>
<td>Yes</td>
<tr>
<td>Lap III Notes</td>
<td><a href="*********" target="new">1</a></td>
<td>N/A</td>
<td>Yes</td>
<tr>
<td>Lap IV Notes</td>
<td><a href="*********** target="new">0</a></td>
<td>N/A</td>
<td>Yes</td>
<tr>
<td>Lap V Notes</td>
<td><a href="************" target="new">1</a></td>
<td>N/A</td>
<td>Yes</td>
<tr>
<td>Lap VI Notes</td>
<td><a href="*********" target="new">0</a></td>
<td>N/A</td>
<td>Yes</td>
<tr>
<td>Lap VII Notes</td>
<td><a href="****************" target="new">1</a></td>
<td>N/A</td>
<td>Yes</td>
<tr>
<td>Lap IIX Notes</td>
<td><a href="**************" target="new">0</a></td>
<td>N/A</td>
<td>Yes</td>
<tr>
<td>Midterm Review</td>
<td><a href="*************">1</a></td>
<td>N/A</td>
<td>Yes</td>
<tr>
<td>Lap IX Notes</td>
<td><a href="*******" target="new">0</a></td>
<td>1/13/13</td>
<td>Yes</td>
<tr>
<td>Lap X Notes</td>
<td><a href="************" target="new">1</a></td>
<td>2/4/13</td>
<td>Yes</td>
<tr>
<td>Lap XI Notes</td>
<td><a href="***************" target="new">0</a></td>
<td>2/4/13</td>
<td>Yes</td>
<tr>
<td>Lap XII Notes</td>
<td><a href="*************" target="new">1</a></td>
<td>2/19/13</td>
<td>No</td>
<tr>
</table>
<hr class="SchoolHrGroup1">
<p style="text-align:center">Spanish</p>
<table border="1" align="center">
<tr>
<td>Title</td>
<td>Link</td>
<td>Date Added</td>
<td>Latest Version</td>
<tr>
<td>Semester 1 Laps</td>
<td><a href="*************">2</a></td>
<td>N/A</td>
<td>Yes</td>
<tr>
<td>Midterm Review</td>
<td><a href="****************">3</a></td>
<td>N/A</td>
<td>Yes</td>
<tr>
</table>
<hr class="SchoolHrGroup1">
<hr class="SchoolHrGroup1">
<p style="font-family:Liberation Serif;text-align:center">History</p>
<table border="1" align="center">
<tr>
<td>Title</td>
<td>LInk</td>
<td>Date Added</td>
<td>Latest Version</td>
<tr>
<td>Semester 1 Laps</td>
<td><a href="http://99.186.124.64/school/HistoryLaps.zip">4</a></td>
<td>N/A</td>
<td>Yes</td>
<tr>
<td>Midterm Study Guide</td>
<td><a href="http://99.186.124.64/school/FALLSEMESTER.docx">5</a></td>
<td>N/A</td>
<td>Yes</td>
<tr>
<td>Chapter 8 Notes...</td>
<tr>
<td>Section 1.1
<td><a href="http://99.186.124.64/school/Chapter8/Section1/Page1.jpg">6</a></td>
<td>1/14/13</td>
<td>Yes</td>
<tr>
<td>Section 1.2</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section1/Page2.jpg">7</a></td>
<td>1/14/13</td>
<td>Yes</td>
<tr>
<td>Section 1.3</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section1/Page3.jpg">8</a></td>
<td>1/14/13</td>
<td>Yes</td>
<tr>
<td>Section 1.4</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section1/Page4.jpg">7</a></td>
<td>1/14/13</td>
<td>Yes</td>
<tr>
<td>Section 1.5</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section1/Page5.jpg">8</a></td>
<td>1/14/13</td>
<td>Yes</td>
<tr>
<td>Section 1.6</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section1/Page6.jpg">7</a></td>
<td>1/14/13</td>
<td>Yes</td>
<tr>
<td>Section 1.7</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section1/Page7.jpg">8</a></td>
<td>1/14/13</td>
<td>Yes</td>
<tr>
<td>Section 1.8</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section1/Page8.jpg">7</a></td>
<td>1/14/13</td>
<td>Yes</td>
<tr>
<td>Section 2.1</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section2/Page1.jpg">8</a></td>
<td>1/15/13</td>
<td>Yes</td>
<tr>
<td>Section 2.2</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section2/Page2.jpg">7</a></td>
<td>1/15/13</td>
<td>Yes</td>
<tr>
<td>Section 2.3</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section2/Page3.jpg">8</a></td>
<td>1/15/13</td>
<td>Yes</td>
<tr>
<td>Section 2.4</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section2/Page4.jpg">7</a></td>
<td>1/15/13</td>
<td>Yes</td>
<tr>
<td>Section 3.1</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section3/Page1.jpg">8</a></td>
<td>1/15/13</td>
<td>Yes</td>
<tr>
<td>Section 3.2</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section3/Page2.jpg">7</a></td>
<td>1/15/13</td>
<td>Yes</td>
<tr>
<td>Section 3.3</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section3/Page3.jpg">8</a></td>
<td>1/15/13</td>
<td>Yes</td>
<tr>
<td>Section 3.4</td>
<td><a href="http://99.186.124.64/school/Chapter8/Section3/Page4.jpg">7</a></td>
<td>1/15/13</td>
<td>Yes</td>
<tr>
<td>Chapter 9</td>
<tr>
<td>Section 1.1</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section1/Page1.jpg">8</a></td>
<td>1/25/13</td>
<td>Yes</td>
<tr>
<td>Section 1.2</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section1/Page2.jpg">7</a></td>
<td>1/25/13</td>
<td>Yes</td>
<tr>
<td>Section 1.3</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section1/Page3.jpg">8</a></td>
<td>1/25/13</td>
<td>Yes</td>
<tr>
<td>Section 1.4</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section1/Page4.jpg">7</a></td>
<td>1/25/13</td>
<td>Yes</td>
<tr>
<td>Section 1.5</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section1/Page5.jpg">8</a></td>
<td>1/25/13</td>
<td>Yes</td>
<tr>
<td>Section 1.6</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section1/Page6.jpg">7</a></td>
<td>1/25/13</td>
<td>Yes</td>
<tr>
<td>Section 1.7</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section1/Page7.jpg">8</a></td>
<td>1/25/13</td>
<td>Yes</td>
<tr>
<td>Section 2.1</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section2/Page1.jpg">7</a></td>
<td>1/29/13</td>
<td>Yes</td>
<tr>
<td>Section 2.2</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section2/Page2.jpg">8</a></td>
<td>1/29/13</td>
<td>Yes</td>
<tr>
<td>Section 2.3</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section2/Page3.jpg">7</a></td>
<td>1/29/13</td>
<td>Yes</td>
<tr>
<td>Section 2.4</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section2/Page4.jpg">7</a></td>
<td>1/29/13</td>
<td>Yes</td>
<tr>
<td>Section 3.1</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section3/Page1.jpg">8</a></td>
<td>1/29/13</td>
<td>Yes</td>
<tr>
<td>Section 3.2</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section3/Page2.jpg">7</a></td>
<td>1/29/13</td>
<td>Yes</td>
<tr>
<td>Section 3.3</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section3/Page3.jpg">8</a></td>
<td>1/29/13</td>
<td>Yes</td>
<tr>
<td>Section 3.4</td>
<td><a href="http://99.186.124.64/school/Chapter9/Section3/Page4.jpg">7</a></td>
<td>1/29/13</td>
<td>Yes</td>
<tr>
<td>Chapter 10</td>
<tr>
<td>Section 1.1</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section1/Page1.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 1.2</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section1/Page2.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 1.3</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section1/Page3.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 1.4</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section1/Page4.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 1.5</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section1/Page5.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 1.6</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section1/Page6.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 1.7</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section1/Page7.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 1.8</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section1/Page8.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 1.9</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section1/Page9.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 1.10</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section1/Page10.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 2.1</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section2/Page1.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 2.2</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section2/Page2.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 2.3</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section2/Page3.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 2.4</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section2/Page4.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 2.5</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section2/Page5.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 2.6</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section2/Page6.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 2.7</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section2/Page7.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 2.8</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section2/Page8.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 2.9</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section2/Page9.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 2.10</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section2/Page10.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 3.1</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section3/Page1.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 3.2</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section3/Page2.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 3.3</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section3/Page3.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 3.4</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section3/Page4.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 3.5</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section3/Page5.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 3.6</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section3/Page6.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 3.7</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section3/Page7.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 3.8</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section3/Page8.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 4.1</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section4/Page1.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 4.2</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section4/Page2.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 4.3</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section4/Page3.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 4.4</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section4/Page4.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 4.5</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section4/Page5.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 4.6</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section4/Page6.jpg">8</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
<td>Section 4.7</td>
<td><a href="http://99.186.124.64/school/Chapter10/Section4/Page7.jpg">7</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
</table>
<hr class="SchoolHrGroup1">
Theology
<table border="1" align="center">
<tr>
<td>Title</td>
<td>Link</td>
<td>Date Added</td>
<td>Latest Version</td>
<tr>
<td>Lap I Notes</td>
<td><a href="https://www.evernote.com/shard/s238/sh/a0c556ea-131b-4cd6-bb58-8b76de14463f/56f7484459730261bf3dbd40293a5b92">9</a></td>
<td>1/16/13</td>
<td>Yes</td>
<tr>
<td>Lap II Notes</td>
<td><a href="https://www.evernote.com/shard/s238/sh/faf8bd81-26b0-45f6-81c9-b6b0a363d650/761637099b3070b10911b83ec7600632" target="new">10</a></td>
<td>2/4/13</td>
<td>Yes</td>
<tr>
<td>Lap III Notes</td>
<td><a href="https://www.evernote.com/shard/s238/sh/c28748b0-4a95-4c0d-b89d-6370a56600cd/3b9793830d55404d1aa84e7e9c159875" target="new">9</a></td>
<td>2/19/13</td>
<td>Yes</td>
<tr>
</table>
<a href="http://99.186.124.64/index.html"><img src="http://99.186.124.64/pics/SpanishMastiff.jpg" style="width:150;height:130;"></>
</body>
</div>
</div>
</html>

some CSS

/*ID:containers*/
#containerSchool {border-color:blue;background-color:#B2CCFF}
#containerHome {border-color:#FF6600;background-color:#FF4040;border-color:red; }
#AuthenticationContainer {border-color:#003300; background-color:#00FF00; }
#LoginContainer {border-color:black; background color:white}
/*ID:contents*/
#Homebody {font-family:Arial; text-align:center; }
#SchoolBody1 {text-align:center; }
/*ID:spans*/
#span1 {color:white}
/*ID:headers*/
#HomeHeading1{background-color:#FF0000;text-align:left; }
#SchoolHeading1{background-color:blue;text-align:left }
#AuthenticationHeader {background-color:#003300;text-align:left}
#LoginHeader {background-color:red;text-align:left}
/*SPECIFIC TAGS*/
hr {color:blue}
html,body {width:100%;height:100%;margin:0;padding:5; }
body {font-family:Arial;text-align:center }
/*CLASSES*/
.linktype1 {color:white;text-decoration:none; }
.spangroup1 {margin-left:15px;margin-right:15px;font-size:20px }
.SchoolHrGroup1 {color:blue; }
.HomeHrGroup1 {Color:red; }
.GenericHeaderProperties1 {padding:13px; }
.GenericContainerProperties1 {border-style:ridge;height:100% }
.SpanTime { float:right; font-size: 15px; color:black; }

Ok, that's everything.

Upvotes: 0

Answers (3)

Chris

Reputation: 618

Ok so I found the problem, I shouldn't have had anything as height in the css file. Now it just wraps content and everything is fitting in there.

Upvotes: 0

Mark

Reputation: 402

Set the height and width of html and body to 100% and then set padding and margin to zero to remove any extra space you might find at the edges in some browsers. So I would add to what Julian put.

html, body {
width:100%;
height:100%;
margin:0;
padding:0;
}

Upvotes: 4

Julian F. Weinert

Reputation: 7560

All you need to do is setting the height and width of html and maybe body too:

html, body {
    width:100%;
    height:100%;
}

Upvotes: 2

&lt;html&gt; doesn&#39;t stretch the entire page

Answers (3)

Related Questions

<html> doesn't stretch the entire page