Marusya's School Notes

Homepage Without Table

Use float to create a homepage with a header, footer, left content and main content.

HTML file:	Displayed by browser:
<style> div.container { width: 100%; margin: 0px; border: 1px solid gray; line-height: 150%; } div.header, div.footer { padding: 0.5em; color: white; background-color: gray; clear: left; } h1.header { padding: 0; margin: 0; } div.left { float: left; width: 160px; margin: 0; padding: 1em; } div.content { margin-left: 190px; border-left: 1px solid gray; padding: 1em; } </style> <body> <div class="container"> <div class="header"><h1 class="header">W3Schools.com</h1></div> <div class="left"><p>"Never increase, beyond what is necessary, the number of entities required to explain anything." William of Ockham (1285-1349)</p></div> <div class="content"> <h2>Free Web Building Tutorials</h2> <p>At W3Schools you will find all the Web-building tutorials you need.</p> <p>W3Schools.com - The largest Web Developers' Site on the internet!</p> </div> <div class="footer">© Copyright by Refsnes Data.</div> </div> </body>	W3Schools.com "Never increase, beyond what is necessary, the number of entities required to explain anything." William of Ockham (1285-1349) Free Web Building Tutorials At W3Schools you will find all the Web-building tutorials you need. W3Schools.com - The largest Web Developers' Site on the internet! © Copyright by Refsnes Data.

HTML file:

Displayed by browser:

<body>
<div class="container">
  <div class="header"><h1 class="header">W3Schools.com</h1></div>
  <div class="left"><p>"Never increase, beyond what is necessary, the number of entities required to explain anything." William of Ockham (1285-1349)</p></div>
  <div class="content">
    <h2>Free Web Building Tutorials</h2>
    <p>At W3Schools you will find all the Web-building tutorials you need.</p>
    <p>W3Schools.com - The largest Web Developers' Site on the internet!</p>
  </div>
  <div class="footer">© Copyright by Refsnes Data.</div>
</div>
</body>

"Never increase, beyond what is necessary, the number of entities required to explain anything." William of Ockham (1285-1349)

Free Web Building Tutorials

At W3Schools you will find all the Web-building tutorials you need.

W3Schools.com - The largest Web Developers' Site on the internet!

I lowered the display on the right side, so that it's easier to read the style and the html coding.