我想使用 <div> 创建一些“表行”和<span> 。 (为什么不使用实际的表格行？因为我想使用很棒的 jquery corner plugin 在每个表格行上设置圆 Angular ，但它似乎不喜欢表格行。)
我想要三个单元格行，其中左侧和右侧单元格宽度固定，中间单元格宽度可变，文本应在其中换行。
[fixedwidth][wrapwrapwrapwrap ][fixedwidth]
[fixedwidth][wrapwrapwrapwrapwrapwrapwr][fixedwidth]
apwrapwrapwrapwrapwrapwr
[fixedwidth][wrapwrapwrapwrap ][fixedwidth]
这是我到目前为止所拥有的，但它是灾难性的错误:
<html>
<head>
<style>
.table-row {
width:100%;
}
.cell1 {
float: left;
width: 200px;
}
.cell2 {
float: left;
}
.cell3 {
float: right;
width: 200px;
}
</style>
</head>
<body>
<div class='table-row'>
<span class="cell1">Title</span>
<span class="cell2">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</span>
<span class="cell3">Available</span>
</div>
</body>
</html>
中心文本不换行，并向下推到下一行。
请问有人可以建议吗？
最佳答案
试试这个:
<style>
.table-row {
display: table-row;
}
.cell1, .cell2, .cell3 {
display: table-cell;
}
.cell1, .cell3 {
width: 200px;
}
</style>
关于html - "Faking"带有 div 和 span 的表行？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4615348/