如何在表中包装数据。目前,如果模板名称太长,我会得到一个滚动条。我希望它进入下一行。
<table class="selectablePreviousOrder dashboard">
<tr ng-class-odd="'tableOdd'" ng-class-even="'tableEven'" style="cursor: pointer"
ng-class="{highlightSelectedSiteRow: selectOrderRow===$index}" ng-repeat="line in listOfProductTemplates | orderBy : '-creationDate'" sglclick="handleSingleClick(line.id)" ng-dblclick="handleSingleClick(line.id)">
<td width="20%" style="max-width: 162px; overflow: auto;" tooltip="{{line.tooltipLabel}}" tooltip-trigger="{{getTooltipTriggerValue(line)}}" tooltip-append-to-body="true" > <span style="margin-left: 5px; float: left">{{line.templateName}}</span></td>
<td width="12%" tooltip="{{line.tooltipLabel}}" tooltip-trigger="{{getTooltipTriggerValue(line)}}" tooltip-append-to-body="true"><span style="margin-left: 5px; float: left">{{line.requestType}}</span></td>
<td width="24%" tooltip="{{line.tooltipLabel}}" tooltip-trigger="{{getTooltipTriggerValue(line)}}" tooltip-append-to-body="true"><span style="margin-left: 10px; float: left">{{line.product}}</span></td>
<td width="18%" tooltip="{{line.tooltipLabel}}" tooltip-trigger="{{getTooltipTriggerValue(line)}}" tooltip-append-to-body="true"><span style="margin-left: 10px; float: left">{{line.creationDate | date : expiryDateFormatter}}</span></td>
<td width="19%" tooltip="{{line.tooltipLabel}}" tooltip-trigger="{{getTooltipTriggerValue(line)}}" tooltip-append-to-body="true" ><span style="margin-left: 15px; float: left">{{line.creatorName }}</span></td>
</tr>
</table>
最佳答案
如评论中所述,您可以使用 CSS 执行此操作:
style="word-wrap: break-word;"
祝您编码愉快:)
关于单元格的 HTML/CSS 包装数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39285680/