Search code examples
css-floatinternet-explorer-7

IE7 float clear


I have some setup, I have replicated it here: jsfiddle.net/vtWsU/9/

Basically there are list items and in every one (not neccessary) there is 1 or 2 'a' tags. I want 'a' tags to float on the right on the same line. It works fine in IE9 and IE8 (its messed up for some reason on this fiddle example in IE8 but I got it working in my full example) but IE7 is still a problem.

I would like to get this working without adding new elements in the dom if possible.

Thank you!


Solution

  • Here is my workaround for your issue: http://jsfiddle.net/vtWsU/13/

    First I added a css style for .playlistNonSelected and set the float to 'left'. This places .playlistNonSelected to the left within the list element. And then I set for .playlistItem 'display:inline-block' and 'width:100%'. It is necessary because it will prevent the elements within the list from collapse as it was before.

    I guess that's all what you need.