Table cell width with bootstrap

when I tried with width property on first td of tr it works fine for me

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
        <div class="row col-md-8">
            <table class="table table-striped">
                <tr>
                    <td width="30%">row name here</td>
                    <td width="70%">sed auctor diam sollicitudin ut. Donec et sodales quam, eu vehicula urna. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Integer eget</td>
                </tr>
                <tr>
                    <td>another row name here</td>
                    <td>sed auctor diam sollicitudin ut. Donec et sodales quam, eu vehicula urna. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Integer egetsdsdfsdf fsdfsdf</td></tr>
            </table>
        </div>
    </div>

As per latest update, width attribute in td will no longer supported, so you should set width through css.

#someid tr td{
    width:30%;
}

using psudo code:

#someid tr td:nth-child(1){
    width:30%;
}

whats the issue you faced?

Here is my take on it. I've added an id to the table for easier access.

The Markup

<div class="container">
    <div class="row col-md-8">
        <table class="table table-striped" id="someid">
            <tr>
                <td>row name here</td>
                <td>sed auctor diam sollicitudin ut. Donec et sodales quam, eu vehicula urna. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Integer eget</td>
            </tr>
            <tr>
                <td>another row name here</td>
                <td>sed auctor diam sollicitudin ut. Donec et sodales quam, eu vehicula urna. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Integer egetsdsdfsdf fsdfsdf</td>></tr>
        </table>
    </div>
</div>

The CSS

#someid tr td:nth-child(1){
    width:30%;
}

Fiddle

You can use the css property table-layout: fixed This will force the given width on the columns:

table {
    table-layout: fixed;
}

td:first-child {
    width: 30%;
}
td:last-child {
    width: 70%;
}

Updated fiddle

Normally you would give every cell in the column the same width but with table-layout: fixed you can set it only on the header cell of the column:

<thead>
    <tr>
        <th class="first">Column A</th>
        <th class="second">Column B</th>
    </tr>
</thead>

As shown in this fiddle