Need Help with Simple Problem

Discussion in 'HTML & Website Design' started by Synchronium, Oct 13, 2008.

  1. #1
    So far, I have a simple two column layout with header and footer.

    The header consists of an h1 tag and a list for navigation, then below that there is a 300px div for the side bar (float:left) and a 660px div for the main content (float: right). Under that is another list for navigation (clear: both);

    Now, I want to add a badge to it (190*190px div with an image). I'm trying to get it to sit to the right, on top of the header navigation list.

    Giving it an absolute positioning and specifying the top and right attributes works great in Firefox but not in IE. I've also tried floating it to the right and setting the top attribute, which puts the badge in the correct place in both browsers but, because two things are floated right (this + main content div), they stack up, pushing the content div down.

    How can I get this badge in the right place on both IE and FF, while keeping the content div level with the sidebar div, just under the navigation?

    Thanx
     
    Synchronium, Oct 13, 2008 IP