Alignment Problem

[smurlos]

Hi Guys,

I'm working on a "wikipedia" type site at the moment and am having a little trouble in regards to aligning tables.

http://knowledge.screw-loose.net/ is the address. If you look, on the left I have my navigation bar. Then below that is my white square content box. I'd like that box to be to the right of the navigation bar, not below it.

Code is as follows:


CSS:
div#main {

width: 350px;
height: 150px;
background: #FFFFFF;
border: 1px solid #000000;
}

div#navbar {

background: url(http://knowledge.screw-loose.net/images/layout/navback.jpg);
width: 160px;
height: 500px;
padding: 0px 0px 0px 20px;
color: #FFFFFF;
font-family: Trebuchet MS, Tahoma, Arial;
font-size: 11px;

}


My index.php3 file is as follows:



<?php
include("top.php3");
include("navbar.php3");

<div id="main" style="" />
test
</div>


The contents of navbar.php3 are as follows:



<div id="navbar" style="" />
<span class="navbarTitle" />WEBSITE</span><br />
<a href="./index.php3" title="Home Page" />??? Home</a><br />
<a href="./about.php3" title="What is our aim?" />??? About</a><br />
<a href="./knowledgeBase/" title="What topic areas do we cover?" />??? Knowledge Base</a><br />
<a href="./faq.php3" title="Frequently Asked Questions" />??? FAQ</a><br />
<a href="./contact/" title="Feedback, bugs, questions NOT in the FAQ etc..." />??? Contact Us</a><br />
<a href="./legal.php3" title="Your privacy, disclaimer, legal stuff..." />??? The Legalities</a><br />
<a href="./sitemap.php3" title="Lost? Well this is no marauder's map but it may just come in handy" />??? Site Map</a><br />
<a href="./newsArchive/" title="News Archive... not much more can be said..." />??? News Archive</a><br /><br />

<?php
if (isset($_COOKIE[Username])) {
// USER IS LOGGED IN
?><span class="navbarTitle" />ACCOUNT</span><br />
<a href="./account/logOut.php3" />??? Log Out</a><br />
<a href="./editProfile.php3" />??? Edit Profile</a><br />
<a href="./knowledgeBase/myQuestions.php3" /><b>??? My Open Questions (<?php echo openquestions($UserID); ?>)</b></a><br />
<a href="./messages/" /><b>??? Private Messages (<?php echo newpm($UserID); ?>)</b></a><br />
<a href="./dashboard/" />??? Your Dashboard</a><br />
<a href="./dashboard/friends.php3" />??? Your Friends</a><br />
<a href="./account/destroyAccount.php3" />??? Remove Account</a><br /><br />
<?php
}
else {
?>
<span class="navbarTitle" />VISITOR</span><br />
<a href="./register/" />??? Register</a><br /><br />
<?php
}
?>

<span class="navbarTitle" />KNOWLEDGE BASE</span><br />
<a href="./knowledgeBase/" />??? Knowledge Base</a><br />
<a href="./knowledgeBase/browse.php3" />??? Share The Knowledge</a><br />
<?php
if (isset($_COOKIE[Username])) { ?>
<a href="./knowledgeBase/suggestTopic.php3" />??? Suggest A Topic</a><br />
<a href="./knowledgeBase/ask.php3" />??? Ask A Question</a><br />
<?php } else { } ?>
<a href="./knowledgeBase/search.php3" />??? Perform Search</a><br />
<a href="./knowledgeBase/contributors.php3" />??? Contributors</a><br />

</div>


Hope someone can help... thanks guys

[rangana]

See if adding highlighted helps:


div#navbar {

background: url(http://knowledge.screw-loose.net/images/layout/navback.jpg);
width: 160px;
height: 500px;
padding: 0px 0px 0px 20px;
color: #FFFFFF;
font-family: Trebuchet MS, Tahoma, Arial;
font-size: 11px;
float:left;

}

[smurlos]

Thank you SO much rangana! I had no idea such a TINY thing could influence it so much!!

Yup, that little tiny 5 letter word made all the difference :D
Thanks again!