Question

有人可以帮我解决一下我的笔布局吗？ http://codepen.io/Sidney-Dev/pen/ALPgbG

当我开始调整页面大小时，列表的内容开始溢出，我无法弄清楚它是什么。

我给表格填充了一个区域，以便正确查看内容是如何溢出的。

div.tables{
  padding: 0 20px;
}

提前致谢。

Answer 1

您正在将display: flex与特定width属性混合。

如果您在表格容器上使用display: flex，请在表格上坚持使用flex: 1，而不是：

table{
  width: 50%;
}

一起去：

table{
  flex: 1;
}

Answer 2

您需要在父容器上设置内容对齐，以便元素知道如何弯曲。您还需要设置表格以灵活的方式显示。

<div class="col-md-6 userform-leftspace">
    <div class="form-group  madotory-border">
        <input type="text" id="regular1" class="form-control" ng-model="systolicBp" pattern="/[0-9]{1,2,3}/" oninvalid="this.setCustomValidity('Please enter a valid reading')" required>
        <label for="regular1">Systolic Bp</label>
    </div>
</div>

如何解决溢出的文本

2 个答案: