samedi 27 juin 2015

Table column are not getting divided from center

This is how my page looks like.

enter image description here

This is code for same.

<table class="table table-bordered">
    <tbody>
        <tr>
            <td>
                <h4>Name & address</h4> 
                <div class="Name">
                    <input ng-model="Name" type="text" placeholder="Name" class="form-control"/>
                </div>              

                <div class="Name">
                    <textarea class="form-control" ng-model="Address" placeholder="Address.." rows="4"></textarea>
                </div>

                <div class="Name">
                    <select ng-init="City=Chhatarpur" ng-model="City" class="form-control">
                        <option value="" ng-selected="selected">City</option>
                        <option value="Chhatarpur" ng-selected="selected">Chhatarpur</option>
                    </select>
                </div>

                <div class="Name">
                    <!--<input  type="text" value="+91" class="form-control" size="2" disabled/>-->
                    <input  ng-model="Mobile" type="text" placeholder="Mobile Number" class="form-control" maxlength="10"/>
                </div>  
            </td>

            <td>
                <h4>Date/time of delivery</h4>
                <div ng-if="(CurrentHour>=18 && CurrentHour<24) || (CurrentHour>=1 && CurrentHour<9)" >
                    <input type="radio" ng-model="order.delivery" value="5"> Tomorrow (09:00-12:00) <br/>
                    <input type="radio" ng-model="order.delivery" value="6"> Tomorrow (12:00-15:00) <br/>
                    <input type="radio" ng-model="order.delivery" value="7"> Tomorrow (15:00-18:00) <br/>
                    <input type="radio" ng-model="order.delivery" value="8"> Tomorrow (18:00-21:00) 
                </div>


                <h4>Payment option </h4>
                <input type="radio" ng-model="order.payment" value="Cash on delivery"> Cash on delivery <br/>
                <input type="radio" ng-model="order.payment" value="Card on delivery"> Card on delivery
                <button style="margin-top:20px;" type="button" class="btn btn-lg btn-primary btn-block" ng-click="">Place order</button>
            </td>
        </tr>
    </tbody>
</table>

It looks like left column taking more width than right one. I want both columns should use 50% of screen width.

What is wrong here. Can some-one please help.

Aucun commentaire:

Enregistrer un commentaire