WordPress side panel

Question

I have been trying to get the WordPress menu inline and below my side navigation but FireBug is not helping and I cant see where I am going wrong! The doe for the side nav is blow but if you go to http://bradburyembroidery.com/houses4cash/blog/ you will see how it moves out of line!

---

 <?php
     /**
      * @package WordPress
      * @subpackage Default_Theme
     */
    ?>
    <div id="sidePanel">
         <div id="categories">
        <ul id="categoryList">
         <li><a href="http://www.housesforcashuk.co.uk/sell-my-house-fast"&gt;Sell My House Fast</a></li>
    <li><a href="http://www.housesforcashuk.co.uk/QuickHouseSale.php"&gt;Quick House Sale</a></li>

    <li><a href="http://www.housesforcashuk.co.uk/sell-and-rent-back"&gt;Sell And Rent Back</a></li>
    <li><a href="http://www.housesforcashuk.co.uk/repossession"&gt;Repossession&lt;/a&gt;&lt;/li&gt;
    <li><a href="http://www.housesforcashuk.co.uk/codeofconduct.php"&gt;Code Of Conduct</a></li>
    <li><a href="http://www.housesforcashuk.co.uk/blog"&gt;Blog&lt;/a&gt;&lt;/li&gt;
    <li><a href="http://www.housesforcashuk.co.uk/testimonials.php"&gt;Testimonials&lt;/a&gt;&lt;/li&gt;
    <li><a href="http://www.housesforcashuk.co.uk/contact-us.php"&gt;Contact Us</a></li>   </ul>

        <div style="padding-top:5px; padding-bottom:5px;" id="copyright">
      Copyright &copy; 2007-09<br /><a href="index.php"><b>Houses For Cash Ltd</b></a><br />

      All Rights Reserved
      </div>


    </div>


    <div style="clear:both;"></div>
    <div id="side2">
    <ul>
          <?php  /* Widgetized sidebar, if you have the plugin installed. */
            if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>
          <li>
           <?php get_search_form(); ?>
          </li>

          <!-- Author information is disabled per default. Uncomment and fill in your details if you want to use it.
          <li><h2>Author</h2>
          <p>A little something about you, the author. Nothing lengthy, just an overview.</p>
          </li>
          -->

          <?php if ( is_404() || is_category() || is_day() || is_month() ||
             is_year() || is_search() || is_paged() ) {
          ?> <li>

          <?php /* If this is a 404 page */ if (is_404()) { ?>
          <?php /* If this is a category archive */ } elseif (is_category()) { ?>
          <p>You are currently browsing the archives for the <?php single_cat_title(''); ?> category.</p>

          <?php /* If this is a yearly archive */ } elseif (is_day()) { ?>
          <p>You are currently browsing the <a href="<?php bloginfo('url'); ?>/"><?php echo bloginfo('name'); ?></a> blog archives
          for the day <?php the_time('l, F jS, Y'); ?>.</p>

          <?php /* If this is a monthly archive */ } elseif (is_month()) { ?>
          <p>You are currently browsing the <a href="<?php bloginfo('url'); ?>/"><?php echo bloginfo('name'); ?></a> blog archives
          for <?php the_time('F, Y'); ?>.</p>

          <?php /* If this is a yearly archive */ } elseif (is_year()) { ?>
          <p>You are currently browsing the <a href="<?php bloginfo('url'); ?>/"><?php echo bloginfo('name'); ?></a> blog archives
          for the year <?php the_time('Y'); ?>.</p>

          <?php /* If this is a monthly archive */ } elseif (is_search()) { ?>
          <p>You have searched the <a href="<?php echo bloginfo('url'); ?>/"><?php echo bloginfo('name'); ?></a> blog archives
          for <strong>'<?php the_search_query(); ?>'</strong>. If you are unable to find anything in these search results, you can try one of these links.</p>

          <?php /* If this is a monthly archive */ } elseif (isset($_GET['paged']) && !empty($_GET['paged'])) { ?>
          <p>You are currently browsing the <a href="<?php echo bloginfo('url'); ?>/"><?php echo bloginfo('name'); ?></a> blog archives.</p>

          <?php } ?>

          </li>
         <?php }?>
         </ul>
         <ul role="navigation">
          <?php wp_list_pages('title_li=<h2>Pages</h2>' ); ?>

          <li><h2>Archives</h2>
           <ul>
           <?php wp_get_archives('type=monthly'); ?>
           </ul>
          </li>

          <?php wp_list_categories('show_count=1&title_li=<h2>Categories</h2>'); ?>
         </ul>
         <ul>
          <?php /* If this is the frontpage */ if ( is_home() || is_page() ) { ?>
           <?php //wp_list_bookmarks(); ?>


          <?php } ?>

          <?php endif; ?>
         </ul>
    </div>  



    </div>

Answer 1

If you add the following line to your #side2 ul it should do the trick: padding-left: 0px;

I inspected your css files and indeed it is hard to track where this 40px are being added.

Answer 2

40px is the default left padding for ul elements in Firefox and Safari, whereas IE sets a 30pt left margin.

Just add "padding-left:0px;margin-left:0px" to your ul.

You might want to use a reset css like http://developer.yahoo.com/yui/reset/ to alleviate this kind of issue.

Answer 3

Thx for informations !! 5 Stars!