Stretch elements in table column IE 7

[Termi2610]

Hey,

im trying to stretch all html elements inside a table column. All of these should be the same width as the broadest.


Example:
http://i.imgur.com/WgeuI.png

Im not setting the width of the elements, its automatically set. Now i want, that all elements have the same width as the broadest ( in this example the last ). How can i realize that?

I played something around with
"display:inline-block"
and the ie7 version:
"zoom: 1;"
"*display: inline;"

but nothing worked...
The problem is, I dont know which is the broadest.
And I have to use IE7 without JS for this.

Hope you guys can help me :)

Thanks!

[Rabbit]

It would help to see the code.

[Termi2610]

Ahh sorry :)
Its a jsp so I hope you can read it :).

JSP ( removed some unnecessary parts )

<table>
                        <tbody>
                            <c:forEach var="elem" items="${tableStructure}">
                                <tr>
                                    <td class="left">
                                         <c:out value="${elem.label}" />
                                    </td>
 
                                    <td>
                                        <c:choose>
                                            <c:when test="${ empty(elem.cbItems) }">
                                                <span class="inline">
                                                    <input type="text" name="editta;${datarow.primaryKey};${elem.fieldName}" />
                                                 </span>
                                            </c:when>
                                            <c:otherwise>
                                                <span class="inline">
                                                    <select name="testname">
                                                        <option value=""></option>
                                                        <c:forEach var="cbItem" items="${elem.cbItems}">
                                                            <option value="${cbItem.value}">${cbItem.shownName}</option>
                                                        </c:forEach>
                                                    </select>
                                                    </span>
                                            </c:otherwise>
                                        </c:choose>
                                    </td>
                                </tr>
                            </c:forEach>
                        </tbody>
                    </table>

CSS:

body {
    background-color: #DEDCDD;
    font-family:Verdana,Arial,sans-serif;
    font-size:1em;
    font-weight:bold;
}
 
table
{
    /*overflow: auto;
    white-space: wrap;
    word-wrap: break-word;
    border-spacing:0;*/
      border-collapse:collapse;
 
      border-style:solid;
      border-color:rgb(136,136,136);
      boorder-width: 2px;
}
 
td {
    color: black;
}
 
td.left {
    text-align:right;
    padding-left:20px;
}
 
 
tbody td {
    height:40px;
 
    background-color: white;
    border-bottom-style: solid;
    border-bottom-color: rgb(136,136,136);
    border-bottom-width: 1px;
}
 
tbody tr:hover td
{
    background-color: rgb(176, 176, 184);
    color:rgb(232,232,232);
}
 
.inline
{
    display: inline-block;
    zoom: 1;
    *display: inline;
}

Thanks :)

[Rabbit]

Have you tried applying a width: 100% to the elements?

[Termi2610]

Yes, but the column has no width then :/

Edit: Ok tried it again, all the elements are small. I think they have the size of the first element.

[Rabbit]

It's hard to see what you're aiming for in the code because there's only one row in the table.

[Termi2610]

There is more than 1 row in the table as you can see in my picture in my first post. Its a jsp with a foreach in my code so there are so much rows as elements in the list :)

<c:forEach var="elem" items="${tableStructure}">
                                <tr>
 

[Rabbit]

It'd be easier to diagnose if we had the code as the client sees it rather than how the server sees it.