Floated all divs, moved Google ad <div id="additional"> to bottom, and encased page in <div id="wrap"> (of course remove red background).
Can you do without repeating WWvA and remove underscore from links?
Code:
@charset "UTF-8"; /* CSS Document */
* { padding: 0; margin: 0; }
body { height:100%; margin:0; padding:0; border:0;
width:100%; min-width:600px; }
#wrap { margin: 0 auto; background: red; width: 95%; min-width: 600px; max-width: 1000px; }
.boxbanner { background: url("../images/vvltgrayparch.jpg");
height: 5em; padding: 10px; text-align: center; }
.bannerleft { float: left; margin-top: 0; }
.bannerright { float: right; margin-top: 0; }
/* *my* nav under the heading */
#navcontainer { margin-left: auto; margin-right: auto; margin-bottom: 8px;
padding-bottom: 8px; border-top: 1px solid #999;
border-bottom: 1px solid #999; z-index: 1; }
#navcontainer ul { list-style-type: none; text-align: center; margin-top: 8px; padding: 0; position: relative; z-index: 2; }
#navcontainer li { display: inline; text-align: center; margin: 0 5px; }
#navcontainer ul li a { padding: 1px 7px; color: #666; background-color: #fff; border: 1px solid #ccc; text-decoration: none; }
#navcontainer ul li a:hover { color: #000; border: 1px solid #666;
border-top: 2px solid #666; border-bottom: 2px solid #666; }
/* Navigation on the left */
#navigation { float: left;
width: 20%; min-width: 50px; max-width: 150px;
padding: 5px; margin: 0 0.1%;
background-color: #EEE8CD;
border: solid 1px #000;
list-style: none;
}
#navigation a:link { text-decoration: none; color: black; }
#navigation a:visited { color: blue; }
#navigation a:hover { color: cyan; text-decoration: overline underline; }
#navigation a:active { color: lime; }
#content { float: left; width: 55%; min-width:200px; max-width: 800px; margin: 0 1% ;
/*margin-left: 192px;
margin-right: 192px;*/
border: solid 1px #000; padding: 10px; color: black;
background: white url("../images/Fontscafe_OldPaper-08a.jpg") no-repeat 100% 100%;
}
#content p, #content h3 {
margin: 0 5px 10px 5px;
}
#container {
padding: 0 20px 0 10px;
}
.ppage {
float: left;
color: #0c11f3
}
.npage {
float: right;
color:#636869
}
.left-top {
float: left;
margin: 5px 20px 10px 10px;
padding: 4px;
border: 1px solid #C4DBEA;
}
.diary {
clear:both;
}
p.indent {
text-indent: 2.0em;
margin: 0 20px;
}
p.cripples {
margin-right: 20%;
margin-left: 30%;
}
hr {
color: blue;
background: blue;
border: 0;
height: 2px;
margin: 5px 0;
}
/* allocate area for Google adds */
#additional {
float: right;
width: 20%; max-width: 160px; min-width: 100px;
padding: 5px; margin: 0 0.1%;
background-color: #99CC99;
border: solid 1px #000;
}
/* only on boxbanner */
h1 {
text-shadow:2px 2px 2px #333333
}
/* letter / diary heading */
h2 {
text-align: center;
margin:.5em 0 .5em 0;
padding:0;
}
/* date associated with a diary entry */
h3 {
/* text-align: left;
margin: 0;
padding: 0 0 5px 0; */
}
h4 {
text-align: left;
margin: 0;
padding: 0;
}
/* bottom banner - what else! */
#footer {
clear: both;
border-top: solid thin blue;
background-color: #66C;
padding: 10px;
border: 1px solid #000;
margin-top: 20px;
text-align: center;
font-size: small;
}
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="3col2.css" >
<meta name="verify-v1" content="OsoUnzoyhAtyoWoJMscuMgM5lgTQD75c9gdw2Mv/9ek=" >
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<title>WWV Diaries - Diary - Sept. 4, 63</title>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-34883848-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head> <body>
<div id="wrap"><div class="boxbanner">
<img class="bannerleft" alt="A Confederate Soldier in 'field' gear" src="images/80cpvt2.jpg" width="28" height="80" >
<img class="bannerright" alt="A Federal Soldier in 'field' gear" src="images/80uspvt2.jpg" width="36" height="80" >
<h1>William Wallace van Amber*<br>Civil War Diaries & Letters</h1>
</div>
<div id="navcontainer">
<ul id="navlist">
<li><a href="index.php">Home Page</a></li>
<li><a href="forward.php">van Amber Letters</a></li>
<li><a href="valinks.php">Civil War Links</a></li>
<li><a href="vacontact.php">Contact Info</a></li>
</ul>
</div>
<div id="container">
<ul id="navigation">
<li><a href="invalidcripples.php">03/14/65 Invalid Cripples</a></li>
<li><a href="630800va1.php">08/??/63 *</a></li>
<li><a href="630801gn1.php">08/01/63 George Newman</a></li>
<li><a href="630805vad.php">08/05/63 * Diary</a></li>
<li><a href="630807va1.php">08/07/63 *</a></li>
<li><a href="630808vad.php">08/08/63 * Diary</a></li>
<li><a href="630809va1.php">08/09/63 *</a></li>
<li><a href="630811vad.php">08/11/63 * Diary</a></li>
<li><a href="630816va1.php">08/16/63 *</a></li>
<li><a href="630817vad.php">08/17/63 * Diary</a></li>
<li><a href="630904va1.php">09/04/63 *</a></li>
<li><a href="630904vad.php">09/04/63 * Diary</a></li>
<li><a href="630918va1.php">09/18/63 *</a></li>
<li><a href="630919vad.php">09/19/63 * Diary</a></li>
<li><a href="631001va1.php">10/01/63 *</a></li>
<li><a href="631002vad.php">10/02/63 * Diary</a></li>
<li><a href="631021va1.php">10/21/63 *</a></li>
<li><a href="631022vad.php">10/22/63 * Diary</a></li>
<li><a href="631103va1.php">11/03/63 *</a></li>
<li><a href="631104vad.php">11/04/63 * Diary</a></li>
<li><a href="631116va1.php">11/16/63 *</a></li>
<li><a href="631117vad.php">11/17/63 * Diary</a></li>
<li><a href="631206va1.php">12/06/63 *</a></li>
<li><a href="631207vad.php">12/07/63 * Diary</a></li>
<li><a href="631213va1.php">12/13/63 *</a></li>
<li><a href="631214vad.php">12/14/63 * Diary</a></li>
<li><a href="631220va1.php">12/20/63 *</a></li>
<li><a href="631221vad.php">12/21/63 * Diary</a></li>
<li><a href="640101va1.php">01/01/64 *</a></li>
<li><a href="640101vad.php">01/01/64 * Diary</a></li>
<li><a href="640114va1.php">01/14/64 *</a></li>
<li><a href="640116vad.php">01/16/64 * Diary</a></li>
<li><a href="640118va1.php">01/18/64 *</a></li>
<li><a href="640119vad.php">01/19/64 * Diary</a></li>
<li><a href="640124va1.php">01/24/64 *</a></li>
<li><a href="640125vad.php">01/25/64 * Diary</a></li>
<li><a href="640212va1.php">02/12/64 *</a></li>
<li><a href="640212vad.php">02/12/64 * Diary</a></li>
<li><a href="640219va1.php">02/19/64 *</a></li>
<li><a href="640225va1.php">02/25/64 *</a></li>
<li><a href="640301vad.php">03/01/64 * Diary</a></li>
<li><a href="640318va1.php">03/18/64 *</a></li>
<li><a href="640320vad.php">03/20/64 * Diary</a></li>
<li><a href="640322va1.php">03/22/64 *</a></li>
<li><a href="640323vad.php">03/23/64 * Diary</a></li>
<li><a href="640327va1.php">03/27/64 *</a></li>
<li><a href="640401vad.php">04/01/64 * Diary</a></li>
<li><a href="640403ma1.php">04/03/64 *</a></li>
<li><a href="640404vad.php">04/04/64 * Diary</a></li>
<li><a href="640410va1.php">04/10/64 *</a></li>
<li><a href="640413dus1.php">04/13/64 *</a></li>
<li><a href="640417va1.php">04/17/64 *</a></li>
<li><a href="640427va1.php">04/27/64 *</a></li>
<li><a href="640503vad.php">05/03/64 * Diary</a></li>
<li><a href="640511va1.php">05/11/64 *</a></li>
<li><a href="640511va2.php">05/11/64 *</a></li>
<li><a href="640512vad.php">05/12/64 * Diary</a></li>
<li><a href="640515va1.php">05/15/64 *</a></li>
<li><a href="640516vad.php">05/16/64 * Diary</a></li>
<li><a href="640518va1.php">05/18/64 *</a></li>
<li><a href="640519vad.php">05/19/64 * Diary</a></li>
<li><a href="640522va1.php">05/22/64 *</a></li>
<li><a href="640523vad.php">05/23/64 * Diary</a></li>
<li><a href="640525va1.php">05/25/64 *</a></li>
</ul>
</div>
<div id="content">
<a class="ppage" href="630904va1.php"> << </a>
<a class="npage" href="630918va1.php"> >> </a>
<div class="diary">
<h2>Diary Entries September 4th, 1863</h2>
<a href="images/630904vad.jpg">
<img alt="photo of this letter" src="images/630904vad_1.jpg" class="left-top" ></a>
<h3>Sat. Sept. 5, 1863</h3>
<p class="indent">Have been down to the river and washed my shirt, socks, towel and handkerchief. There is some skirmishing between us and Lees men every night. About a mile between us.</p>
<h3>Sun. Sept. 6, 1863</h3>
<p class="indent">Had inspection of everything. Went over to the division hospital to see Rastus White, He was taken there Wednesday it seems like. Sunday here, it is very still except playing cards, there is a good deal of that going on. I have not had a card in my hand yet.</p>
</div>
<div class="diary">
<hr>
<a href="images/630907vad.jpg">
<img alt="photo of this letter" src="images/630907vad_1.jpg" class="left-top" ></a>
<h3>Mon. Sept. 7, 1863</h3>
<p class="indent">It is all quiet here with nothing going on but I drill a while </p>
<h3>Tues. Sept. 8, 1863</h3>
<p class="indent">Nothing new. The same as yesterday,</p>
<h3>Wed. Sept. 9, 1863</h3>
<p class="indent">No drill today. General policing of camp today. Expect a general inspection of camp and clothing tomorrow or next day.</p>
</div>
<div class="diary">
<hr>
<a href="images/630910vad.jpg">
<img alt="photo of this letter" src="images/630910vad_1.jpg" class="left-top" ></a>
<h3>Thu. Sept. 10, 1863</h3>
<p class="indent">Went over to the 106 regt today. Saw lots of boys that I was acquainted with. Saw Horis Pickett had a good visit with him.</p>
<h3>Fri. Sept. 11, 1963</h3>
<p class="indent">We have not had any rain since I came here. It is very pleasant and warm yet. My health is good.</p>
<h3>Sat. Sept. 12, 1863</h3>
<p class="indent">Drill this morning as ever and battalion drill this afternoon. It rained this afternoon a little.</p>
</div>
<div class="diary">
<hr>
<a href="images/630913vad.jpg">
<img alt="photo of this letter" src="images/630913vad_1.jpg" class="left-top" ></a>
<h3>Sun. Sept. 13, 1863</h3>
<p class="indent">We had an awful thunderstorm this morning before daylight. It is now midday. We got orders to be ready to march at a minutes notice last night.</p>
<h3>Mon. Sept. 14, 1863</h3>
<p class="indent">Detailed for camp guard today; to go at 10 o. c. Two boys over from the 106th Ratio Maltby and Burny Vanorman.</p>
<h3>Tues. Sept. 15, 1863</h3>
<p class="indent">Came off guard at 10 o.c. this morning. We received pay today. 20 dollars & 80 cts. Got three days rations and 60 cartridges with orders to be ready to march this afternoon.</p>
</div>
<div class="diary">
<hr>
<a href="images/630916vad.jpg">
<img alt="photo of this letter" src="images/630916vad_1.jpg" class="left-top" ></a>
<h3>Wed. Sept. 16, 1863</h3>
<p class="indent">Started this morning from camp at 6 o.c. crossed the Rappahannock and marched towards Culpeper. We are camped for the night near Culpeper.</p>
<h3>Thu. Sept. 17, 1863</h3>
<p class="indent">Here in camp near Culpeper doing nothing. No drill today. There is a whole corps of infantry laying here. A good many of the regiments received conscripts yesterday. It rained some today. I sent a letter to I. M. J. today with 10 dollars.</p>
<h3>Fri. Sept. 18, 1863</h3>
<p class="indent">It rains like fun this morning, it rained till about noon. Henry Knox has gone to the hospital tonight. I took his knapsack for him. I have written a letter to my dear Ett today.</p>
</div>
</div>
<div id="additional">
<script type="text/javascript"><!--
google_ad_client = "ca-pub-8709792112703145";
/* aj wide */
google_ad_slot = "6718516750";
google_ad_width = 160;
google_ad_height = 600;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div><!--closADDITIONAL-->
<div id="footer">
<p> Copyright © 2005 - 2012 Alfred M. Jones<br>
Last changed: September 27, 2012.</p>
</div><!--closFOOTER-->
</div><!--closWRAP-->
</body>
</html>