问题描述
好像有很多这样的问题，但它们似乎都涉及拉伸最右边的元素，而我想拉伸最右边元素以外的任何元素（最左边或中心元素）。最好显示我的进度，因此：
见 Moonlightcheese 的 Pen Onsen UI (@moonlightcheese) 在CodePen。基本上有一个 input 元素需要拉伸以填充可用空间，右侧有一个具有 40px 固定宽度的按钮。我该如何实现？
如果你看不到笔，这是代码：
<head>
<link rel="stylesheet" href="https://unpkg.com/onsenui/css/onsenui.css">
<link rel="stylesheet" href="https://unpkg.com/onsenui/css/onsen-css-components.min.css">
<script src="https://unpkg.com/onsenui/js/onsenui.min.js"></script>
</head>
<ons-page>
<style>
.labels td {
font-size: small;
color: red;
padding-top: 20px;
padding-left: 32px;
padding-right: 20px;
padding-bottom: 0px;
width: 50%
}
.labels td * {
padding-bottom: 0px;
width: 100%;
}
.inputs td {
padding-top: 0px;
padding-left: 20px;
padding-right: 20px;
width: 50%;
}
.inputs td ons-input,.inputs td ons-input input,.inputs td ons-input span,.inputs td ons-select,.inputs td ons-select select {
padding-top: 0px;
width: 100%;
}
.date {
width: 100%;
}
table {
border-collapse: separate;
}
td.most ons-input,td.most ons-input input,td.most ons-input span,td.most ons-button {
display: inline-block;
width: auto;
}
td.most ons-button {
width: 40px;
}
</style>
<table>
<tr class="labels">
<td colspan="2" class="full">
Job Number
</td>
</tr>
<tr class="inputs">
<td colspan="2" class="most">
<ons-input
autocomplete="off"
id="jobNumberEntryInput"
input-id="jobNumberEntryInputField"
modifier="underbar"
class="autocomplete"
placeholder="JOB NUMBER">
</ons-input>
<ons-button
id="search-btn"
class="search-button">
<ons-icon icon="fa-search"></ons-icon>
</ons-button>
</td>
</tr>
</table>
</ons-page>
解决方法
暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！
如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@）