html - 如何将 "form"中的一个 "li"元素与另一个 "li"对齐？

Question

我创建了 JSFiddle来说明我的错误。

我只想对齐“ul”中的所有“li”元素

<div id="easySearchMenu">
    <ul>
        <li>Categories
            <ul>
                <li>Classifieds</li>
                <li>Business listings</li>
                <li>Propetries</li>
            </ul>
        </li>
        <li>Advanced Search</li>
        <li>
            <form id="searchForm">
                <fieldset>
                    <div class="input">
                        <input type="text" name="s" id="s" value="Enter your search" />
                    </div>
                    <input type="submit" id="searchSubmit" value="" />
                </fieldset>
            </form>
        </li>
        <li>Log in / Register</li>
    </ul>
</div>

Answer 1

您在内部 ul 中使用 block 级元素，导致不必要的复杂化。

您可以将 fieldset 更改为 display:inline-block 以对齐这些框，尽管这对不同的高度没有帮助。