我的一个网页上出现的一个小小的化妆品问题。当我放置最大字符时，文本会超出我的编辑功能和原始网页中的模型屏幕，这会导致表格在窗口小部件上重叠。它显示如下列出的代码：
<div class="row">
<div class="col-xs-12 col-md-12">
<div class="widget">
<div class="widget-header vela-widget-header">
<div class="col-xs-6 col-md-6 text-align-left no-padding-left">
<h4>Client List</h4>
</div>
<div class="col-xs-6 col-md-6 no-padding-right pull-right">
<span class="pull-right padding-5 padding-right-10">
<a href type="button" class="btn btn-sm shiny" ng-click="showFilter = !showFilter">Show Filters</a>
<a href type="button" class="btn btn-sm shiny" ng-click="openModal()">Create New Client</a>
</span>
</div>
</div>
<div class="widget-body padding-bottom-50">
<table ng-table="clientTableOptions "
class="table table-bordered table-striped margin-bottom-10" show-filter="showFilter">
<tr ng-repeat="entity in $data" ng-click="onRowSelect(entity)">
<td data-title="'Name'" sortable="'name'" filter="{ name: 'text'}">
{{entity.name}}
</td>
<td data-title="'Type'" sortable="'type'" filter="{ type: 'text'}">
{{entity.type}}
</td>
<td data-title="'First Line of Address'" sortable="'address1'" filter="{ address1: 'text'}">
{{entity.address1}}
</td>
<td data-title="'City'" sortable="'city'" filter="{ city: 'text'}">
{{entity.city}}
</td>
<td data-title="'State / Province'" sortable="'stateProvince'"
filter="{ stateProvince: 'text'}">
{{entity.stateProvince}}
</td>
<td data-title="'Country'" sortable="'country'" filter="{ country: 'text'}">
{{entity.country}}
</td>
<td data-title="'Status'">
<span ng-bind-html="renderCrudEntityState(entity)"></span>
</td>
<td data-title="'Action'">
<a ng-click="openModal(entity.id)" class="btn btn-default btn-xs purple">
<i class="fa fa-edit"></i>Modify
</a>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="modal-header">
<h3 class="modal-title" ng-show="isNew">Create New Client</h3>
<h3 class="modal-title" ng-hide="isNew">Modify Client "
{{targetEntity.name}}"</h3>
</div>
<div class="modal-body">
<ng-include src="'views/partials/notification-area.html'"></ng-include>
<form class="form-horizontal" name="clientDetailsForm">
<fieldset>
<div class="form-group"
ng-class="{ 'has-error' : clientDetailsForm.name.$invalid && !clientDetailsForm.name.$pristine }">
<label for="name"
class="col-lg-4 col-sm-4 col-xs-4 control-label no-padding-right">Name* </label>
<div class="col-lg-7 col-sm-7 col-xs-7">
<input type="text" class="form-control" id="name" name="name" ng-model="targetEntity.name"
required placeholder="Name" ng-maxlength="255">
<p ng-show="clientDetailsForm.name.$invalid && !clientDetailsForm.name.$pristine"
class="help-block">Mandatory field, maximum length 255
characters.</p>
</div>
</div>
<div class="form-group">
<label class="col-lg-4 col-sm-4 col-xs-4 control-label no-padding-right">Type</label>
<div class="col-lg-7 col-sm-7 col-xs-7">
<div class="radio">
<label>
<input name="type" type="radio" value="VENDOR" ng-
model="targetEntity.type"
ng-checked="!targetEntity.type ||
targetEntity.type == 'VENDOR'"
ng-
change="handleTypeChange(targetEntity.type)">
<span class="text">Vendor</span>
</label>
</div>
<div class="radio">
<label>
<input name="type" type="radio" value="SUBSCRIBER" ng-model="targetEntity.type"
ng-checked="targetEntity.type && targetEntity.type == 'SUBSCRIBER'"
ng-change="handleTypeChange(targetEntity.type)">
<span class="text">Subscriber</span>
</label>
</div>
</div>
</div>
<div class="form-group">
<label for="vendorClient" class="col-lg-4 col-sm-4 col-xs-4 control-label no-padding-right">Vendor
Client</label>
<div class="col-lg-7 col-sm-7 col-xs-7">
<select ng-options="vendorClientSingle.id as vendorClientSingle.name for vendorClientSingle in vendorClientList"
id="vendorClient"
ng-disabled="targetEntity.type == 'VENDOR' || targetEntity.type == null"
ng-model="targetEntity.vendorClient">
<option value=""> -- Please Select (Subscribers Only) --</option>
</select>
</div>
</div>
<div class="form-group"
ng-class="{ 'has-error' : clientDetailsForm.vendorReportingId.$invalid && !clientDetailsForm.vendorReportingId.$pristine }">
<label for="vendorReportingId"
class="col-lg-4 col-sm-4 col-xs-4 control-label no-padding-right">Reporting ID (Vendors
Only)</label>
<div class="col-lg-7 col-sm-7 col-xs-7">
<input type="text" class="form-control" id="vendorReportingId" name="vendorReportingId"
ng-model="targetEntity.vendorReportingId" placeholder="Vendor Reporting Identifier"
value="{{targetEntity.vendorReportingId}}" ng-maxlength="64"
ng-disabled="targetEntity.type == 'SUBSCRIBER'">
<p ng-show="clientDetailsForm.vendorReportingId.$invalid && !clientDetailsForm.vendorReportingId.$pristine"
class="help-block">Optional field, maximum length 64 characters.</p>
</div>
</div>
<div class="form-group"
ng-class="{ 'has-error' : clientDetailsForm.address1.$invalid && !clientDetailsForm.address1.$pristine }">
<label for="address1" class="col-lg-4 col-sm-4 col-xs-4 control-label no-padding-right">Address
Line 1</label>
<div class="col-lg-7 col-sm-7 col-xs-7">
<input type="textarea" class="form-control" id="address1" name="address1"
ng-model="targetEntity.address1" placeholder="Address Line 1"
value="{{targetEntity.address1}}" ng-maxlength="128">
<p ng-show="clientDetailsForm.address1.$invalid && !clientDetailsForm.address1.$pristine"
class="help-block">Optional field, maximum length 128 characters.</p>
</div>
</div>
<div class="form-group"
ng-class="{ 'has-error' : clientDetailsForm.address2.$invalid && !clientDetailsForm.address2.$pristine }">
<label for="address2" class="col-lg-4 col-sm-4 col-xs-4 control-label no-padding-right">Address
Line 2</label>
<div class="col-lg-7 col-sm-7 col-xs-7">
<input type="textarea" class="form-control" id="address2" name="address2"
ng-model="targetEntity.address2" placeholder="Address Line 2"
value="{{targetEntity.address2}}" ng-maxlength="128">
<p ng-show="clientDetailsForm.address2.$invalid && !clientDetailsForm.address2.$pristine"
class="help-block">Optional field, maximum length 128 characters.</p>
</div>
</div>
<div class="form-group"
ng-class="{ 'has-error' : clientDetailsForm.address3.$invalid && !clientDetailsForm.address3.$pristine }">
<label for="address3" class="col-lg-4 col-sm-4 col-xs-4 control-label no-padding-right">Address
Line 3</label>
<div class="col-lg-7 col-sm-7 col-xs-7">
<input type="textarea" class="form-control" id="address3" name="address3"
ng-model="targetEntity.address3" placeholder="Address Line 3"
value="{{targetEntity.address3}}" ng-maxlength="128">
<p ng-show="clientDetailsForm.address3.$invalid && !clientDetailsForm.address3.$pristine"
class="help-block">Optional field, maximum length 128 characters.</p>
</div>
</div>
<div class="form-group"
ng-class="{ 'has-error' : clientDetailsForm.city.$invalid && !clientDetailsForm.city.$pristine }">
<label for="city" class="col-lg-4 col-sm-4 col-xs-4 control-label no-padding-right">City</label>
<div class="col-lg-7 col-sm-7 col-xs-7">
<input type="textarea" class="form-control" id="city" name="city"
ng-model="targetEntity.city" placeholder="City" value="{{targetEntity.city}}"
ng-maxlength="64">
<p ng-show="clientDetailsForm.city.$invalid && !clientDetailsForm.city.$pristine"
class="help-block">Optional field, maximum length 64 characters.</p>
</div>
</div>
<div class="form-group"
ng-class="{ 'has-error' : clientDetailsForm.stateProvince.$invalid && !clientDetailsForm.stateProvince.$pristine }">
<label for="stateProvince" class="col-lg-4 col-sm-4 col-xs-4 control-label no-padding-right">State
/ Province</label>
<div class="col-lg-7 col-sm-7 col-xs-7">
<input type="textarea" class="form-control" id="stateProvince" name="stateProvince"
ng-model="targetEntity.stateProvince" placeholder="State / Province"
value="{{targetEntity.stateProvince}}" ng-maxlength="64">
<p ng-show="clientDetailsForm.stateProvince.$invalid && !clientDetailsForm.stateProvince.$pristine"
class="help-block">Optional field, maximum length 64 characters.</p>
</div>
</div>
<div class="form-group"
ng-class="{ 'has-error' : clientDetailsForm.postCode.$invalid && !clientDetailsForm.postCode.$pristine }">
<label for="postCode" class="col-lg-4 col-sm-4 col-xs-4 control-label no-padding-right">Post
Code / ZIP Code</label>
<div class="col-lg-7 col-sm-7 col-xs-7">
<input type="textarea" class="form-control" id="postCode" name="postCode"
ng-model="targetEntity.postCode" placeholder="Post Code / ZIP Code"
value="{{targetEntity.postCode}}" ng-maxlength="64">
<p ng-show="clientDetailsForm.postCode.$invalid && !clientDetailsForm.postCode.$pristine"
class="help-block">Optional field, maximum length 64 characters.</p>
</div>
</div>
<div class="form-group"
ng-class="{ 'has-error' : clientDetailsForm.country.$invalid && !clientDetailsForm.country.$pristine }">
<label for="country"
class="col-lg-4 col-sm-4 col-xs-4 control-label no-padding-right">Country</label>
<div class="col-lg-7 col-sm-7 col-xs-7">
<input type="textarea" class="form-control" id="country" name="country"
ng-model="targetEntity.country" placeholder="Country"
value="{{targetEntity.country}}" ng-maxlength="64">
<p ng-show="clientDetailsForm.country.$invalid && !clientDetailsForm.country.$pristine"
class="help-block">Optional field, maximum length 64 characters.</p>
</div>
</div>
</fieldset>
</form>
</div>
<div class="modal-footer">
<button class="btn btn-blue" ng-click="handleCreate()" ng-
show="isNew" ng-disabled="clientDetailsForm.$invalid">
Create New Client
</button>
<button class="btn btn-blue" ng-click="handleUpdate()" ng-hide="isNew"
ng-disabled="clientDetailsForm.$invalid">
Save Updates to Client
</button>
<button class="btn btn-blue" ng-click="handleDelete()" ng-hide="isNew"
ng-disabled="clientDetailsForm.$invalid || disableDeletionReason"
title="{{disableDeletionReason}}">
Delete Client
</button>
<button class="btn btn-blue" ng-click="handleCancel()">Cancel</button>
</div>
如果我的术语有误，抱歉，对语言和编程不熟悉，那么希望我的解释和截图足够了！