CSS定位基线

发布于 2024-11-03 08:46:10 字数 744 浏览 0 评论 0原文

我希望下拉菜单与上面的 Btn1-2 和 Btn3 具有相同的基线级别，但在单元格内。基本上和现在的情况相反。我缺少什么？谢谢

<table style="width:100%">
    <tr style="border:1px solid #000">
        <td>
            <div style="position:relative">
            <input type="button" value="Bt1" /> 
            <input type="button" value="Bt2" /> 
                <div style="position:absolute; top:0; right:0;">
                    <input type="button" value="Btn3" /> <br />
                    <select>
                        <option>Hello</option>
                    </select>
                </div>
            </div>
        </td>
    </tr>
</table>

原文

I would like to have the dropdown at the same baseline level of Btn1-2 and Btn3 above, but within the cell. Basically the opposite as what it is now. What am I missing? Thanks

<table style="width:100%">
    <tr style="border:1px solid #000">
        <td>
            <div style="position:relative">
            <input type="button" value="Bt1" /> 
            <input type="button" value="Bt2" /> 
                <div style="position:absolute; top:0; right:0;">
                    <input type="button" value="Btn3" /> <br />
                    <select>
                        <option>Hello</option>
                    </select>
                </div>
            </div>
        </td>
    </tr>
</table>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

你列表最软的妹 2024-11-10 08:46:10

您应该这样做：

<table style="width:100%">
    <tr style="border:1px solid #000">
        <td>
            <div style="float:left;">
            <input type="button" value="Bt1" /> 
            <input type="button" value="Bt2" /> 
            </div>
            <div style="float:right;">
            <input type="button" value="Btn3" />                    
                   <select>
                        <option>Hello</option>
                    </select>
            </div>
        </td>
    </tr>
</table>

为两个 div 设置 float。这是演示： http://jsfiddle.net/naveed_ahmad/DnWWy/

That's how you should do this:

<table style="width:100%">
    <tr style="border:1px solid #000">
        <td>
            <div style="float:left;">
            <input type="button" value="Bt1" /> 
            <input type="button" value="Bt2" /> 
            </div>
            <div style="float:right;">
            <input type="button" value="Btn3" />                    
                   <select>
                        <option>Hello</option>
                    </select>
            </div>
        </td>
    </tr>
</table>

Set float for the two divs. Here is the demo: http://jsfiddle.net/naveed_ahmad/DnWWy/

回复收藏 0 原文

我一向站在原地 2024-11-10 08:46:10

更改 div 样式：position:absolute;定位：相对；这会将其保留在细胞内。

回复收藏 0 原文

著墨染雨君画夕 2024-11-10 08:46:10

你可以试试这个。

<table style="width:100%">
<tr style="border:1px solid #000">
    <td>
        <div style="position:relative">
        <input type="button" value="Bt1" />
        <input type="button" value="Bt2" />
            <div style="position:absolute; top:0; right:0;">
                <input type="button" value="Btn3" />
                <select>
                    <option>Hello</option>
                </select>
            </div>
        </div>
    </td>
</tr>

You can try this one.

<table style="width:100%">
<tr style="border:1px solid #000">
    <td>
        <div style="position:relative">
        <input type="button" value="Bt1" />
        <input type="button" value="Bt2" />
            <div style="position:absolute; top:0; right:0;">
                <input type="button" value="Btn3" />
                <select>
                    <option>Hello</option>
                </select>
            </div>
        </div>
    </td>
</tr>

回复收藏 0 原文

~没有更多了~