Html 表列未从中心分开
这就是我的页面的外观 这是相同的代码Html 表列未从中心分开,html,css,Html,Css,这就是我的页面的外观 这是相同的代码 <table class="table table-bordered"> <tbody> <tr> <td> <h4>Name & address</h4> <div class="Name"> <input
<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>
姓名和地址
城市
恰塔普
交货日期/时间
明天(09:00-12:00)
明天(12:00-15:00)
明天(15:00-18:00)
明天(18:00-21:00)
支付选择权
货到付款
货到付款
下单
看起来左列比右列宽。我想两列都应该使用50%的屏幕宽度
这里出了什么问题。请找个人帮忙。给每个
td
一个50%的宽度
<table class="table table-bordered">
<tbody>
<tr>
<td width="50%">
<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 width="50%">
<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>
姓名和地址
城市
恰塔普
交货日期/时间
明天(09:00-12:00)
明天(12:00-15:00)
明天(15:00-18:00)
明天(18:00-21:00)
支付选择权
货到付款
货到付款
下单
使用列宽度类,因为您使用的是类table table border
我想您正在使用引导css
如果您使用的是bootstrapv3.0及以上版本,请使用下面的
<div class="col-md-6">
// LEFT COLUMN CODE GOES HERE
</div>
<div class="col-md-6">
// RIGHT COLUMN CODE GOES HERE
</div>
//左列代码在这里
//右栏代码在这里
如果您使用的是少于bootstrapv3.0
<div class="span6">
// LEFT COLUMN CODE GOES HERE
</div>
<div class="span6">
// RIGHT COLUMN CODE GOES HERE
</div>
//左列代码在这里
//右栏代码在这里
使用此代码非常有效。我的意思是,它们的宽度相等。我没有像你说的那样看到这个问题。它很好用。它们的宽度相等。有什么不对劲吗?事实上,根据inspector的说法,左栏的宽度是506px,而右栏的宽度只有483px。