Problem with display:inline-block footer following a float:right div

[seegoon]

Hi guys.

I have a footer set to display:inline-block so that it'll shrink to fit its contents. It works fine when it follows other block or inline elements, it seems. However, when it follows a div set to float:right, it aligns to the left of that div. Here's the relevant css:

#footer {
    clear:both;
    padding:0 20px 13px;
    background-color:transparent;
    border-width:18px 22px 0 20px;
    -webkit-border-image:url(images/footer/footer-bg.png) 38% 5% 0% 5%;
    -moz-border-image:url(images/footer/footer-bg.png) 38% 4% 0% 4%;
    border-image:url(images/footer/footer-bg.png) 38% 5% 0% 5%;
    display:inline-block;
    margin-top:30px;
}
 
#continue {
    background-color:#c7bfbd;
    margin:30px 0;
    border-width:0 30px 5px 3px;
    -webkit-border-image:url(images/continue-arrow-3.gif) 0% 62% 8% 6%;
    -moz-border-image:url(images/continue-arrow-3.gif) 0% 62% 8% 6%;
    border-image:url(images/continue-arrow-3.gif) 0% 62% 8% 6%;
    float:right;
}
 

and the html:

<div id="wrap">
    <div id="continue">
        <p><a href="/somewhere/">You stay in control. Always.</a></p>
    </div>
 
<div id="footer">
    <ul>
        <li>&copy; My website 2010 / </li>
        <li><a href="/">Home</a> / </li>
        <li><a href="/contact/">Contact</a> / </li>
 
        <li><a href="/legal.php#privacy">Privacy</a> / </li>
        <li><a href="/legal.php#help">Help</a> / </li>
        <li><a href="/legal.php#terms-of-use">Terms of use</a> / </li>
        <li><a href="/sitemap.php">Sitemap</a></li>
    </ul>
</div>
</div>
 

I hope this gives you an idea of the problem.

[MusoFreak200]

i will need a link if you have one...

[seegoon]

Actually guys, don't worry. I've solved it. Just added an empty div with the property clear:both and a height attribute. My footer's an include, so it works across the entire site. It would've been nice to have solved it using pure css and no extra elements, but such is life.