Question

我在DIV上创建了一个内联表，我已经调整了它。

基本上，它允许某人使用jQuery调整表格单元格的大小。

如果您开始使用内联表然后调整表格单元格的大小，我该如何防止.spacer表格单元在中心扩展和收缩？我希望表格单元格的左侧位置保留在左侧，只允许正确的大小扩展或缩小？

我希望这是有道理的！这里的jsfiddle示例（请首先展开外部div然后调整内部间隔div的大小）：http://jsfiddle.net/GT5Pc/

CSS：

    .draggableElementContainer {
    width:300px;
    border:#000 dashed 1px;
    display:inline-table;
    white-space:nowrap;
}
label {
        width: fit-content;
        max-width: fit-content;
        min-width: fit-content;
}
    .spacer {
        border: #000 dashed 1px;
        display: table-cell;
        white-space: nowrap;
       text-align: left;
       width: 100%;
    }

HTML：

<div class="draggableElementContainer">
    <label>Test</label>
    <div class="spacer">
       </div>
    <input type="input" id="test" />

</div>

jQuery的：

$("div").resizable();

Answer 1

将固定table-layout添加到.draggableElementContainer选择器：

.draggableElementContainer {
    ...
    table-layout: fixed;
}

JSFiddle demo

阻止div table-cell在中心调整大小？

1 个答案: