0

如何使文本框和表单字段在同一行中对齐...我提供了内联显示但它不起作用...在下面提供我的代码...如何修复它...文本字段是一个按钮下方的线......

http://jsfiddle.net/S9PYV/embedded/result/

<div class="bs-docs-example" id="notesDocumentsOuterDF">        
    <div class="documents-make-container">
        <!--<div class="insert-items-container">
            <label for="idName">Name</label>
            <input id="idName" type="text" name="name" value="" required="required" />
        </div>-->

        <div class="insert-items-container">
            <select class="greenButton">
                <option value="volvo">Create</option>
                <option value="saab">Saab</option>
                <option value="opel">Opel</option>
                <option value="audi">Audi</option>
            </select>

            <select class="greenButton">
                <option value="volvo">Email|Access</option>
                <option value="saab">Saab</option>
                <option value="opel">Opel</option>
                <option value="audi">Audi</option>
            </select>

            <input type="submit" class="greenButton" value="Add Contacts">
        </div>

        <div class="insert-items-container" style="float: right;">
            <!--<label for="idImageUpload">Image</label>-->
            <input type="file" name="file" id="idImageUpload" class="file" size="40">
            <div id="fakefile" class="fakefile">
                <input type="text" class="fakeinput">
                <img src="/images/icons/search.png">
            </div>
        </div>

        <!--<div class="insert-items-container">
            <label for="idContactSel">Contacts List</label>
            <select id="idContactSel" name="contactselect">
                <option value="">select email to share </option>
            </select>                               
            <input id="shareListBtn" class="greenButton" type="button" value="Share List" alt="sharelist">
            <input id="contactListBtn" class="greenButton" type="button" value="Contacts List" alt="contactlist">
            <input id="AddContactBtn" class="greenButton" type="button" value="Add Contacts" alt="addcontacts">
        </div>-->

        <!--<div class="insert-items-container">
            <label for="idShareList">Share List</label>
            <div id="idShareList" class="email-selected-container">
                <table cellspacing="0" cellpadding="0" border="0" class="table">
                    <thead>
                        <tr class="documentsListHeading" role="row">
                            <th width="100px;">name</th>
                            <th width="180px;">Email</th>
                            <th>Permission</th>
                        </tr>
                    </thead>
                    <!-- share list -->
            </div>
        </div>
4

1 回答 1

0

你的第一个insert-items-container有 100% 的宽度（作为默认的 div），所以它填满了整行。您可以通过将文本框insert-items-container与其他表单字段放在相同的位置来解决此问题，或者将所有insert-items-containers 设置为float: left

于 2013-04-08T19:21:34.567 回答