css - 文本框忽略宽度属性，但在 Jsfiddle 中有效

Question

我的所有代码都在这个 JSFiddle 中 - http://jsfiddle.net/ugngp7ft/1/

HTML:

<div class="text_container_border">
    <div class="row">
        <label class="input_label">#1&nbsp;Name&nbsp;and&nbsp;Phone&nbsp;Number:</label>
            <span class="input_span">
                <input type="text" class="hidden_textfield" value=""/>
            </span>
        </div>
    <div class="row">
        <label class="input_label">#2&nbsp;Name&nbsp;and&nbsp;Phone&nbsp;Number:</label>
        <span class="input_span">
            <input type="text" class="hidden_textfield" value=""/>
        </span>
    </div>
    <div class="row">
        <label class="input_label">#3&nbsp;Name&nbsp;and&nbsp;Phone&nbsp;Number:</label>
        <span class="input_span">
            <input type="text" class="hidden_textfield" value=""/>
        </span>
    </div>
    <div class="row">
        <label class="input_label">#4&nbsp;Name&nbsp;and&nbsp;Phone&nbsp;Number:</label>
        <span class="input_span">
            <input type="text" class="hidden_textfield" value=""/>
        </span>
    </div>
</div>

CSS:

.row {

    display: table-row;

}

.input_label {

    display: table-cell;
    margin: 0px;
    padding: 0px;
}

.input_span {

    display: table-cell;
    width: 100%;
    padding: 0px 10px;

}

.hidden_textfield {

    width: 100%;
    border: none;
    outline: none;
    background-color: transparent;
    font-family: inherit;
    font-size: inherit;

}

.text_container_border {

    display: table;
    width: 100%;
    border: 1px solid #b2b2b2;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 10px;

}

.notes {

    border: 1px solid #b2b2b2;
    height:80px;
    width: 100%;
    overflow: auto;
    resize: none;

}

它在那里工作得很好。我从上一个问题的答案中得到了这个想法，该问题向我指出了一篇关于如何让文本框在父 DIV 标签中的标签之后采用额外宽度的帖子。文章位于 - How to make text input box to occupy all the remaining width within parent block?

无论如何，我必须实现一个新的小部分才能使我的确切代码工作，即表格的“行”部分。

在那个 JSFiddle 中，一切都完美无缺，但是当在我的服务器的空白测试页面上实现时，文本框没有调整大小。

Answer 1

当客户不想花时间修复 CSS 时，我不得不使用这种纯粹的 hack。 (注意 - 这不是我的代码，我被雇来解决问题并发现了 CSS 问题。)

我所做的是编写更正 CSS 并将其放置在最后一次读取的位置，并添加了 !important 以覆盖其他 CSS 代码。

这绝不是正确的一叠，但它在紧要关头对我有用。