How to Fix the width of 3 columns Grid

[albanah]

Hello,

I have modified the following code to get equal sidebar widths.
It is working very well with all browsers, except IE7.

I need help to figure out what is the reason so that I can use this grid.

PHP Code:

<style type="text/css">
#gridl3_container {
    position: relative;
    clear: both;
    float: left;
    width: 100%;
    }

#gridl3_midshift {
    float: left;
    width: 200%;
    position: relative;
    left: 170px;
}

#gridl3_rightshift {
    float: left;
    width: 100%;
    position: relative;
    left: 50%;
    margin-left: -340px;
}

#gridl3_midmask {
    float: right;
    width: 50%;
    position: relative;
    right: 100%;
}

#gridl3_midcol {
    margin-left: 390px;
    width: 100%;
    overflow: hidden;
}

#gridl3_leftcol {
    float: left;
    width: 230px;
    position: relative;
    margin-left: -50%;
    left: 171px;
    
}

#gridl3_rightcol {
    float: left;
    width: 230px;
    position: relative;
    left: -60px;
    
}

#gridl3_content {
    margin-right: 80px;
margin-left: 420px;
}
</style>

<div id="gridl3_container">
    <div id="gridl3_midshift">
        <div id="gridl3_rightshift">
            <div id="gridl3_midmask">
                <div id="gridl3_midcol">
                    <div id="gridl3_content">
                        <ul class="list_no_decoration" id="widgetlist_column2">$column[2]</ul>
                    </div>
                </div>
            </div>
            <div id="gridl3_leftcol">
                <ul class="list_no_decoration" id="widgetlist_column1">$column[1]</ul>
            </div>
            <div id="gridl3_rightcol">
                <ul class="list_no_decoration" id="widgetlist_column3">$column[3]</ul>
            </div>
        </div>
    </div>
</div>