IE7 hack float / block error

Question

I'm having trouble getting this layout to work in IE7:

<span class="box">Headline<a href="more">More...</a></span>

.box {
 display: block;
}

.box a {
 display: inline;
 float: right;
}

All browsers display it correctly;

Headline                            More...

But IE7 does the following:

Headline
                                    More...

Any ideas on how to fix this? I tried to set a to lock, the built-in block, something, did not work. Also with some commonly used fixes like box-model etc.

Answer 1

Try putting the tag <a>at the beginning..box

<span class="box"><a href="more">More...</a>Headline</span>