okay, so I'm trying to set up a webpage with a div wrapping two other divs, and the wrapper div has a background, and the other two are transparent. How come this isn't working?

here is the CSS:

.posttext{
    float: left;
    width: 70%;
    text-align: left;
    padding: 5px;
    background-color: !important #transparent;
}

.postavi{
    float: left;
    width: 100px;
    height: 100%;
    text-align: left;
    background-color: #transparent;
    padding: 5px;
}

.postwrapper{
    background-image:url('images/post_bg.png');
    background-position:left top;
    background-repeat:repeat-y;
}

and here is the HTML:

<div class="postwrapper">

                            <div class="postavi"><img src="http://prime.programming-designs.com/test_forum/images/avatars/hacker.png" alt="hacker"/></div><div class="posttext"><p style="color: #ff0066">You will have bad luck today.</p>lol</div>
                        </div>