I fixed it.
^ You were right on the spot, I didn't even think about that, as for getting everything aligned correctly, it was just a matter of letting the main menu be and let it be 40 pixels to the right, then adding a second div and putting the margin-left for that to -40px.
Everything is fine, and went better than expected.
Code for those curious
Code:
<!-- navbar -->
<div id="navigation">
<div id="navigation_fix">
<ul id="menu">
<li class="page_item"><a href="http://918thefan.com">Home</a>
<ul class="children">
<li class="page_item">
<a href="http://918thefan.com/home/about/">About</a>
</li>
<li class="page_item">
<a href="http://918thefan.com/home/volunteer/">Join Us</a>
</li>
<li class="page_item">
<a href="http://918thefan.com/home/faq/">FAQ</a>
</li>
<li class="page_item">
<a href="http://918thefan.com/home/advertise/">Advertise</a>
</li>
</ul>
</li>
<li class="page_item"><a href="http://918thefan.com/radio/">Radio</a>
<ul class="children">
<li class="page_item">
<a href="http://918thefan.com/radio/playlist/">Playlist</a>
</li>
</ul>
</li>
<li class="page_item_active"><a href="http://918thefan.com/forums">Community</a>
<ul class="children">
<li class="page_item_active"><a href="http://918thefan.com/forums/">Forums</a>
<ul class="children">
<if condition="$show['member']">
<li class="page_item">
<a href="http://918thefan.com/forums/usercp.php">User CP</a>
</li>
<li class="page_item">
<a href="http://918thefan.com/forums/faq.php">Rules</a>
</li>
<li class="page_item">
<a href="http://918thefan.com/forums/group.php">Fanclubs</a>
</li>
<li class="page_item">
<a href="http://918thefan.com/forums/calendar.php">Calendar</a>
</li>
<li class="page_item">
<a href="http://918thefan.com/forums/search.php">Search</a>
</li>
<li class="page_item">
<a href="login.php?$session[sessionurl]do=logout&logouthash=$bbuserinfo[logouthash]" onclick="return log_out('$vbphrase[sure_you_want_to_log_out]')">Log Out</a>
</li>
<else />
<li class="page_item">
<a href="http://918thefan.com/forums/register.php">Register</a>
</li>
<li class="page_item">
<a href="http://918thefan.com/forums/usercp.php">Log In</a>
</li>
</if>
</ul>
</li>
<li class="page_item"><a href="http://918thefan.com/forums/chat.php">IRC</a>
<ul class="children">
<li class="page_item">
<a href="http://918thefan.com/irc-chat/irc-faq/">IRC FAQ</a>
</li>
<li class="page_item">
<a href="http://918thefan.com/irc-chat/irc-rules/">IRC Rules</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="page_item">
<a href="http://918thefan.com/vip-section/">VIP Section</a>
</li>
<li class="page_item"><a href="http://918thefan.com/store/">Store</a>
<ul class='children'>
<li class="page_item">
<a href="http://sharkrobot.com/918thefan/">Apparel</a>
</li>
<li class="page_item">
<a href="http://zazzle.com/918thefan/">Buttons</a>
</li>
<li class="page_item">
<a href="http://918thefan.com/vip-area/">Fanatics</a>
<ul class="children">
<li class="page_item">
<a href="http://918thefan.com/forums/payments.php">Renew</a>
</li>
<li class="page_item">
<a href="http://918thefan.com/custom-forum-usernames/">Usernames</a>
</li>
<li class="page_item">
<a href="http://918thefan.com/forums/showthread.php?t=334">Music Priority</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
</div>
<!-- / navbar -->
CSS remains the same except for a single ID added with a margin of -40px
Issue is resolved allow me to celebrate:
http://www.youtube.com/watch?v=T9rJLtz64Hg