0

我有一个我正在为任务管理/错误报告应用程序工作的表格..

我已经编写了代码来添加一个新的错误报告并且它可以工作,现在我正在寻找一点点修复 HTML,但我在 atextarea和 a的宽度上遇到了一些问题textbox

<div class="g12">
<form action="{{ path('feedback_create', { 'category': category }) }}" method="post" {{ form_enctype(form) }}>
        <fieldset>
            <label class="handle">Title</br><span class="small">Short Descriptive Title</span></label>
            {{ form_widget(form.title )}}
            <label class="handle">Problematic Steps</br><span class="small">Detailed Steps to Reproduce the Problem</span></label>
            {{ form_widget(form.userNotes)}}
        </fieldset>
    {{ form_rest(form) }}
    <p>
        <button type="submit">Create</button>
    </p>
</form>
</div>

这是我目前拥有的 HTML——它显示了我想要的方式。除了textbox和文本区域似乎与表格的两侧重叠。我试图清除我的缓存,并包装 form_widget设置宽度的div中的行无济于事......

我已经创建了 jsfiddle 上缺少的 CSS 最少的基础知识,用于视觉方面的工作。

http://jsfiddle.net/758ub/

我很感激任何解决它的想法或提示。

4

1 回答 1

3

你的 CSS 有

input, textarea { width: 99%; } /* This is not the cause */

我注意到把:

display: none; /* This is not the cause */

在这两个项目(INPUT 和 TEXTAREA)上仍然会保持表格非常宽。这是由于您的 .g12 类宽度值。当我把

.g12 { width: auto; } /* This is a solution */

它缩小了。在小提琴中,滚动条仍然存在,因为第一个 DIV,宽度为 800px。我想这应该保持不变。

请注意,您应该将此规则放在宽度适用于 .g12 的其他规则下,或者使选择器更重:

div.g12 { width: auto; }
于 2012-06-28T08:29:57.660 回答