Weird firefox bug to do with margin and floats

by wheresrhys

HTML

<ul>
    <li>item</li>
</ul>
<div class="follower"></div>
<ul class="fixed">
    <li>item</li>
</ul>
<div class="follower"></div>

CSS

.follower {
    background: green;
    height:10px;
}
li {
    float:left
}
ul{
    list-style: none outside none;
    margin: 0;
    padding: 0;
    margin-bottom: 20px;
    background:10px;
    background:red
}
ul:after {
    clear: both;
    content: " ";
    display: block;
    height: 0;
    visibility: hidden;
}
ul.fixed:after {
   display: inline-block;   
}