[Wolves] CSS layout question

[Matthew Revell]

Howdy all,

I know there are some people in here, whose understanding of CSS - Aq - 
far outstrips mine.

At the moment, I have a fairly major problem with front page layout of 
ContentPeople, when rendered in Opera, or a KHTML browser. Load up 
http://www.contentpeople.info/ and you'll see what I mean. I'll explain 
the way it's scripted:

There is a wrapper div, the stylesheet entry for which has a "float: 
right". This forms a right hand column, with additional information 
boxes in it.

Then, there is a wrapper which has a "float: left" on it and has divs 
which, in turn, are floated left and right and contain links to the 
latest stories on the site.

This renders just luverly in Moz and IE. Kick up Opera or Safari/Konq 
and you end up with orphan stories at the bottom.

Can anyone think of a reason for this? Below is the stylesheet that 
handles it.

#stories
{
    width:520px;
}

#leadstory
{

    background: #E4F2FF;
    margin-top: 10px;
    margin-bottom: 5px;
    border-bottom: 2px solid #E4F2FF;
}

#leadstoryheadline
{
    font-family: arial, helvetica;
    font-size: 2em;
    margin: 5px;
    margin-bottom: 0px;
    font-weight: bold;
    color: #ae2c20;
}

.storyteaser
{
    font-size: 1em;
    margin: 5px;
}

.storyimage
{
    float: right;
    margin: 5px;
    margin-top: 0px;
}

.storyread
{
    float: right;
    margin: 5px;
    margin-top: 0px;
}

.secondarystorywrapper
{

    float: left;
    margin-bottom: 10px;
}

.secondarystoryleft
{

    float: left;

    width: 240px;
    margin-right: 5px;
    background: #ffffff;
   

}

.secondarystoryright
{
    width: 240px;
    margin-left: 5px;
    float: right;
    background: #ffffff;
   
   
}

.storyheadline
{
    color: #ae2c20;
    font-size: 1em;
    margin: 5px;
    margin-bottom: 2px;
    font-weight: bold;
}

.storybyline
{
    margin-left: 5px;
    font-size: 0.8em;
    font-weight: bold;
}