Navigation

Basic 2 Columns

Adding a Style Sheet

2 Column Web Page - 3

This is the same basic 2 column web page with the addition of some inline style sheets added for the borders.

I made the left column a container for the navigational links of the 3 page website and moved the content to the right column.

I set an outer border for the table using an inline style sheet in the table tag. I set its thickness to 2 pixels.

I set a left border on the right column using an inline style sheet and set its thickness to one pixel. I set the color of both borders to #0060ff.

The code

<!doctype html public "-//w3c//dtd HTML 4.0 Transitional//EN">
<html>
<head>
<title>2 Column Web Page</title>
<style type="text/css">
h1 {font-family:arial,serif;font-size:16pt;font-weight-bold; font-style:normal; text-align:center}
p {font-family:arial,serif; font-size: 10pt; font-style:normal; font-weight:normal; text-align:left; text-indent: 1em }
a {font-family:arial; font-size:10pt; font-style:normal; font-weight:normal }
</style>
</head>
<body>
<table width="100%" cellpadding="5" cellspacing="0" style="border: solid #0060ff 2px">
<tr valign="top">
<td width="200px" bgcolor= "#99ccff" align="center">
<p><b>Navigation</b></p>
<p><a href="2-column-tables.html">Basic 2 Columns</a></p>
<p><a href="2-column-tables-2.html">Adding a Style Sheet</a></p>
</td>
<td align="center" style="border-left: solid #0060ff 1px">
<h1>2 Column Web Page - 3</h1>
<p>This is the same basic 2 column web page with the addition of a 3 line embedded style sheet added to the head section and some inline style sheets added for the borders.</p>
<p>I also made the left column a container for the navigational links of the 3 page website.</p>
<p>I set an outer border for the table using an inline style sheet in the table tag. I set its thickness to 2 pixels.</p>
<p>I set a left border on the right column using an inline style sheet and set its thickness to one pixel. I set the color of both borders to #0060ff.</p>
<h1>The code</h1>
<code></code>
</td></tr></table>
</body>
</html>

Note: Code omitted in code for clarity. Changes in red.