Question

I have a table structure like below:

<table>
<tr>
    <td>
        <div id="FirstDiv">
            <table>
                    <tr>
                            <td>
                            </td>
                    </tr>
            </table>
        </div>            
    </td>
    <td>
        <div id="SecondDiv">
        </div>
    </td>
</tr>
</table>

The structure of FirstDiv and SecondDiv are same. The td tag inside FirstDiv contains some text and I am showing the text (Text is dynamic one,it is coming from back end.) using anchor tag but if the text is more wider than 150px, it is pushing the border to right. According to requirement, there should not be any horizontal scroll bar so, I tried to wrap the text inside the anchor tag, giving styles like word-wrap:normal, but till now not able to fix it. Its either giving me a horizontal scroll bar or pushing the border to right.

Thanks in advance.

Answer 1

Try this:

table {table-layout:fixed}
td {width:50%}