Question

如何在表单末尾添加水平标签。
只需一个滚动条即可滚动整个页面，由于两个垂直div，目前我有两个滚动条。

请帮助。

<div>
    <div class="split left">
        <div>
        </div>
    </div>
    <div class="split right">
        <div>
        </div>
    </div>


    <div>
        <div class="w3-bar w3-black">
            <button class="w3-bar-item w3-button tablink w3-red" onclick="openCity(event,'London')">London</button>
            <button class="w3-bar-item w3-button tablink" onclick="openCity(event,'Paris')">Paris</button>
            <button class="w3-bar-item w3-button tablink" onclick="openCity(event,'Tokyo')">Tokyo</button>
        </div>

        <div id="London" class="w3-container w3-border city">
            <h2>London</h2>
            <p>London is the capital city of England.</p>
        </div>

        <div id="Paris" class="w3-container w3-border city" style="display:none">
            <h2>Paris</h2>
            <p>Paris is the capital of France.</p>
        </div>

        <div id="Tokyo" class="w3-container w3-border city" style="display:none">
            <h2>Tokyo</h2>
            <p>Tokyo is the capital of Japan.</p>
        </div>
    </div>
</div>

Answer 1

尝试一下应该有帮助

Updated fiddle

select {
        width: 160%;
        padding: 2px;
    }

尽量不要将宽度超过100％

Answer 2

我在回答您的第一个问题，因为第二个问题还不够清楚：我在“ w3-bar”中添加了一个内联样式，以固定位置声明div并将其设置为固定在底部。

如果我可以更清楚地了解您要实现的目标，则可以重写代码并与您共享小提琴链接。

<div class="w3-bar w3-black" style="position: fixed; bottom: 0">
                <button class="w3-bar-item w3-button tablink w3-red" onclick="openCity(event,'London')">London</button>
                <button class="w3-bar-item w3-button tablink" onclick="openCity(event,'Paris')">Paris</button>
                <button class="w3-bar-item w3-button tablink" onclick="openCity(event,'Tokyo')">Tokyo</button>
            </div>

对齐div标签，需要在表单后放置“水平”标签

2 个答案: