I am trying to alter a blog template to my specs and I can't figure out how to lessen the distance between the 'date header', the 'post title and the 'content'.
Here is the code I've been playing around with:
<html>
<head>
<title><$BlogPageTitle$></title>
<style type="text/css" media="screen">
h1 {font-family:garamond;font-size:20px;border-bottom:dotted 1px #000000;color:#555555;padding-bottom:0px;margin-bottom:0px;}
h2 {font-family:garamond;font-size:14px; }
h2#archives {padding-top:5px;margin-top:5px;border-top:dotted 1px #999999;}
h3 {font-family:garamond;font-size:10 px;padding-top:2px;color:#555555;padding-bottom:0px;margin-bottom:0px;}
body {font-family:arial;font-size:10px;margin:3%;padding:0px;background:#ffffff;color:#000000;}
div.blogPost {padding-left:5%;padding-right:10%;}
div.byline {color:#555555;}
p#bloggerBug {padding-top:5px;}
.blogComments {padding-top:5px;color:#555555;padding-bottom:0px;margin-bottom:0px;font-weight:bold}
.blogComments .byline {font-size:1em;font-weight:normal;color:#555555;margin-right:10px;display:inline}
.blogComment {font-size:1em;margin:3%;color:#000000;font-weight:normal}
.deleted-comment {font-style:italic;color:gray;}
.comment-link {margin-left:.6em;}
</style>
<$BlogMetaData$>
</head>
<body>
<!-- To aid with the Blogger NavBar -->
<div id="wrap4">
<!-- Header -->
<h1><$BlogTitle$></h1>
<$BlogDescription$>
<!-- Blog Posts -->
<Blogger>
<BlogDateHeader>
<h3><$BlogDateHeaderDate$></h3>
</BlogDateHeader>
<a name="<$BlogItemNumber$>"> </a>
<BlogItemTitle><h2><BlogItemURL><a href="<$BlogItemURL$>"></BlogItemURL>
<$BlogItemTitle$><BlogItemURL></a></BlogItemURL></h2></BlogItemTitle>
<div class="blogPost">
<$BlogItemBody$><br />
<div class="byline">posted by <a href="<$BlogItemPermalinkURL$>" title="permanent link"><$BlogItemAuthorNickname$> # <$BlogItemDateTime$></a><MainOrArchivePage><BlogItemCommentsEnabled> <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>><$BlogItemCommentCount$> comments</a></BlogItemCommentsEnabled><BlogItemBacklinksEnabled>
<a class="comment-link" href="<$BlogItemPermalinkUrl$>#links">links to this post</a>
</BlogItemBacklinksEnabled>
</MainOrArchivePage> <$BlogItemControl$> </div>
</div>
<ItemPage>
<div class="blogComments">
<BlogItemCommentsEnabled><a name="comments"></a>
Comments:
<BlogItemComments>
<div class="blogComment">
<a name="<$BlogCommentNumber$>"></a> <$BlogCommentBody$><br />
<div class="byline"><a href="<$BlogCommentPermalinkURL$>" title="permanent link">#</a> posted by <$BlogCommentAuthor$> : <$BlogCommentDateTime$></div>
<$BlogCommentDeleteIcon$>
</div>
</BlogItemComments>
<$BlogItemCreate$>
</BlogItemCommentsEnabled>
<br /> <br />
<BlogItemBacklinksEnabled>
<a name="links"></a>
Links to this post:
<BlogItemBacklinks>
<div class="blogComment">
<a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a>
<$BlogBacklinkDeleteIcon$>
<br />
<$BlogBacklinkSnippet$><br />
<div class="byline">
<span class="comment-poster">
<em>posted by <$BlogBacklinkAuthor$> @ <$BlogBacklinkDateTime$></em>
</span>
</div>
</div>
</BlogItemBacklinks>
<p class="comment-timestamp"><$BlogItemBacklinkCreate$></p>
</BlogItemBacklinksEnabled>
<br /> <br />
<a href="<$BlogURL$>"><< Home</a>
</div>
</ItemPage>
</Blogger>
<!-- Archive Links -->
<h2 id="archives">Archives</h2>
<p><BloggerArchives>
<a href="<$BlogArchiveURL$>"><$BlogArchiveName$></a>
</BloggerArchives>
<script type="text/javascript" language="Javascript">if (location.href.indexOf("archive")!=-1) document.write("<strong><a href=\"<$BlogURL$>\">Current Posts</a></strong>");</script></p>
</div>
</body>
</html>
And here is the page:
http://moniquesevenans.homestead.com/files/m7imitations.html
Any help would be greatly appreciated. I just don't get this stuff.
