Brett
05-04-2005, 09:42 PM
I'm trying to make the links in my right navigation box align to the right, instead of the left.
My page is HERE (http://brett.6te.net/main.htm).
Here's my HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Brett's Place - Home</title>
<style type="text/css" media="screen">@import "stylesheet.css";</style>
</head>
<body>
<div class="content">
<h1>Updates</h1>
<p><b>Wednesday, May 4, 2005:</b><br>
I started construction of the site today, since I finally found a good host. There's really no content right now, except for the DBGT Episode 57 review, which you can read in it's entirety. xP The side menu to the right entitled "New Additions" has the link, or you could click the Reviews link on the left. Yeah, that's awesome, huh? I'm awesome. Mwuhahaha... And of course, the forums are always open for posting. Now go post.</p>
</div>
<div class="content">
<center><font size="1">©Brett Productions</font></center>
</div>
<div id="navAlpha">
<h2><center>.:Menu:.</center></h2>
<p>
<a href="main.htm" title="This'll take you back to the main page.">Home</a><br>
<a href="http://s6.invisionfree.com/yzf" title="I am Brett's message board.">Forum</a><br>
<a href="reviews.htm" title="Various reviews written by yours truly.">Reviews</a><br>
<a href="opinion.htm" title="I give my 2 cents on various crap.">Opinion</a><br>
<a href="works.htm" title="Anything from my art projects to writing.">Works</a><br>
<a href="friends.htm" title="I give my friends a chance to show their stuff... not like that.">Friends</a><br>
<a href="misc.htm" title="If it don't go anywhere else...">Misc</a><br>
<a href="about.htm" title="Anything you ever wanted to know about me. You know you do.">About/FAQ</a><br>
<a href="links.htm" title="Linkage to cool sites.">Links</a><br>
<a href="contact.htm" title="Get a hold of me.">Contact</a><br>
</p>
</div>
<div id="navBeta">
<h2><center>.:New Additions:.</center></h2>
<p><a href="reviews/gtep57.htm" title="A review of Dragonball GT episode 57">DBGT Ep. 57 Review</a><br></p>
</div>
</body>
</html>
I want the DBGT Ep. 57 Review link to align to the right of that menu box, as well as any future links I add to it. I'm not too familiar with CSS, so I'm not sure what to do.
BTW, here's my CSS if it's needed:
body {
color:Black;
background-color:SlateGray;
margin:20px;
padding:0px;
font:11px verdana, arial, helvetica, sans-serif;
}
h1 {
margin:0px 0px 15px 0px;
padding:0px;
font-size:28px;
font-weight:900;
color:#000
}
h2 {
font:bold 12px/14px verdana, arial, helvetica, sans-serif;
margin:0px 0px 5px 0px;
padding:0px;
}
p {
font:11px/20px verdana, arial, helvetica, sans-serif;
margin:0px 0px 16px 0px;
padding:0px;
}
.Content>p {margin:0px;}
.Content>p+p {text-indent:30px;}
a {
color:#09c;
font-size:11px;
font-family:verdana, arial, helvetica, sans-serif;
font-weight:600;
text-decoration:none;
}
a:link {color:#09c;}
a:visited {color:#07a;}
a:hover {background-color:#ccc;}
/* All the content boxes belong to the content class. */
.content {
position:relative; /* Position is declared "relative" to gain control of stacking order (z-index). */
width:auto;
min-width:120px;
margin:0px 210px 20px 170px;
border:1px solid black;
background-color:#ccc;
padding:10px;
z-index:3; /* This allows the content to overlap the right menu in narrow windows in good browsers. */
}
#navAlpha {
position:absolute;
width:150px;
top:20px;
left:20px;
border:1px solid black;
background-color:#ccc;
padding:10px;
z-index:2;
voice-family: "\"}\"";
voice-family:inherit;
width:128px;
}
body>#navAlpha {width:128px;}
#navBeta {
position:absolute;
width:190px;
top:20px;
right:20px;
border:1px solid black;
background-color:#ccc;
padding:10px;
z-index:1;
voice-family: "\"}\"";
voice-family:inherit;
width:168px;
}
body>#navBeta {width:168px;}
Any help would be much appreciated. xP
My page is HERE (http://brett.6te.net/main.htm).
Here's my HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Brett's Place - Home</title>
<style type="text/css" media="screen">@import "stylesheet.css";</style>
</head>
<body>
<div class="content">
<h1>Updates</h1>
<p><b>Wednesday, May 4, 2005:</b><br>
I started construction of the site today, since I finally found a good host. There's really no content right now, except for the DBGT Episode 57 review, which you can read in it's entirety. xP The side menu to the right entitled "New Additions" has the link, or you could click the Reviews link on the left. Yeah, that's awesome, huh? I'm awesome. Mwuhahaha... And of course, the forums are always open for posting. Now go post.</p>
</div>
<div class="content">
<center><font size="1">©Brett Productions</font></center>
</div>
<div id="navAlpha">
<h2><center>.:Menu:.</center></h2>
<p>
<a href="main.htm" title="This'll take you back to the main page.">Home</a><br>
<a href="http://s6.invisionfree.com/yzf" title="I am Brett's message board.">Forum</a><br>
<a href="reviews.htm" title="Various reviews written by yours truly.">Reviews</a><br>
<a href="opinion.htm" title="I give my 2 cents on various crap.">Opinion</a><br>
<a href="works.htm" title="Anything from my art projects to writing.">Works</a><br>
<a href="friends.htm" title="I give my friends a chance to show their stuff... not like that.">Friends</a><br>
<a href="misc.htm" title="If it don't go anywhere else...">Misc</a><br>
<a href="about.htm" title="Anything you ever wanted to know about me. You know you do.">About/FAQ</a><br>
<a href="links.htm" title="Linkage to cool sites.">Links</a><br>
<a href="contact.htm" title="Get a hold of me.">Contact</a><br>
</p>
</div>
<div id="navBeta">
<h2><center>.:New Additions:.</center></h2>
<p><a href="reviews/gtep57.htm" title="A review of Dragonball GT episode 57">DBGT Ep. 57 Review</a><br></p>
</div>
</body>
</html>
I want the DBGT Ep. 57 Review link to align to the right of that menu box, as well as any future links I add to it. I'm not too familiar with CSS, so I'm not sure what to do.
BTW, here's my CSS if it's needed:
body {
color:Black;
background-color:SlateGray;
margin:20px;
padding:0px;
font:11px verdana, arial, helvetica, sans-serif;
}
h1 {
margin:0px 0px 15px 0px;
padding:0px;
font-size:28px;
font-weight:900;
color:#000
}
h2 {
font:bold 12px/14px verdana, arial, helvetica, sans-serif;
margin:0px 0px 5px 0px;
padding:0px;
}
p {
font:11px/20px verdana, arial, helvetica, sans-serif;
margin:0px 0px 16px 0px;
padding:0px;
}
.Content>p {margin:0px;}
.Content>p+p {text-indent:30px;}
a {
color:#09c;
font-size:11px;
font-family:verdana, arial, helvetica, sans-serif;
font-weight:600;
text-decoration:none;
}
a:link {color:#09c;}
a:visited {color:#07a;}
a:hover {background-color:#ccc;}
/* All the content boxes belong to the content class. */
.content {
position:relative; /* Position is declared "relative" to gain control of stacking order (z-index). */
width:auto;
min-width:120px;
margin:0px 210px 20px 170px;
border:1px solid black;
background-color:#ccc;
padding:10px;
z-index:3; /* This allows the content to overlap the right menu in narrow windows in good browsers. */
}
#navAlpha {
position:absolute;
width:150px;
top:20px;
left:20px;
border:1px solid black;
background-color:#ccc;
padding:10px;
z-index:2;
voice-family: "\"}\"";
voice-family:inherit;
width:128px;
}
body>#navAlpha {width:128px;}
#navBeta {
position:absolute;
width:190px;
top:20px;
right:20px;
border:1px solid black;
background-color:#ccc;
padding:10px;
z-index:1;
voice-family: "\"}\"";
voice-family:inherit;
width:168px;
}
body>#navBeta {width:168px;}
Any help would be much appreciated. xP