IE7 Rendering Problem

Hello all.
I have been met by the terrible monolith known as the IE render engine.

On this page of a blog I am working on, some padding seems to be screwing up. I have ventured to solve it but only some parts of the CSS hacks are not working as desired.

Page Code:

<div id="sidebar">
    <div id="contact">

        <img src="<?php bloginfo('stylesheet_directory'); ?>/images/ContactMathea.jpg" width="220" height="36" />

        <h4>Address</h4>
        <p>PO Box 5694 <br />
        Lambton Quay <br />
        Wellington 6145 <br />
        New Zealand</p>

        <h4>Phone</h4>
        <p>+64 4 971 9981</p>

        <h4>Mobile</h4>
        <p>+64 27 281 2774</p>

        <h4>Email</h4>
        <a href="mailto:[email protected]">[email protected]</a>

    </div>
    <div class="blogsidebar">
    <?php
    if ($atpage=="Blogpage"){

        $args=array('title_li'=> '<h4>Categories</h4>','hide_empty'=>0,'orderby' => 'ID','exclude' => 1);
        wp_list_categories($args);
        ?>

        <h4 class="archives">Archives</h4>
        <?php
        $args=array('type' => 'monthly','limit' => 12);
        wp_get_archives($args);
        ?>
        <a href="<?php bloginfo('url'); ?>/archive">See older entries</a>

        <h4>Recent Entries</h4>
        <?php
        $args = array('numberposts'=>5);
        $myposts = get_posts($args);
        $first=true;
        foreach($myposts as $post){
         ?>
            <ul>
                <li><a href="<?php echo($post->guid); ?>"><?php the_title(); ?></a></li>
            </ul>
         <?php

         }

        $args=array('categorize'=>0,'title_li'=> '<h4>Useful Links</h4>');
        wp_list_bookmarks($args);
    }
    ?>
    </div>
</div>

CSS(With Hacks):

/* sidebar styles */

#contact {
	padding-bottom:10px;
	margin-bottom:30px;
	border-bottom:2px solid #aee8ec;
}
#contact a {
	color:#FFFFFF;
	margin:8px 0px 11px;
	font-weight:normal;
}
#contact h4 {
	margin:0px;
	padding-top:11px;
	color:#FFFFFF;
	border-top:2px solid #aee8ec;
}
#contact p {
	margin:6px 0px 11px;
}

#sidebar h4,#sidebar p,#sidebar a {

}
ul.blogroll li {
        margin-bottom:12px;
        padding:0;
        line-height:13px;
}
#sidebar .blogsidebar {
        line-height:19px;

}
#sidebar .blogsidebar h4 {
	font-size:14px;
	margin-top:26px;

}

#sidebar .blogsidebar ul {
	list-style:none;
}

#sidebar .blogsidebar li {
	list-style:none;
}

/* Test */

#sidebar li.categories h4 {
        background-color:blue;
}
#sidebar li.categories h4 {
        *background-color:red;
        *float:left;
}
#sidebar li.linkcat h4 {
        background-color:blue;
}
#sidebar li.linkcat h4 {
        *background-color:blue;
        *float:left;
}

#sidebar .archives a{
	color:#625D5C;
	font-size:12px;
	color:#FFF;
}

The initial problem is that the the titles “Categories” and “Useful Links” which are both in different sub-divs and different <h4> tags. But they seem to have a higher padding-left value assigned to them.
Which I am unable to reduce. Currently the float property moves it to where I want it, but it screws up all the PHP content under it, which is not really how it should be. I’ve tried adding right padding and margins but they seem to have no affect.

Any help is valued, cheers.