代码之家 › 专栏 › 技术社区 › Oleh Prypin

在div中安装一个文本框和一个按钮

html css

Oleh Prypin · 技术社区 · 14 年前

<input type="text"/> 和 <input type="button"/> 一行,像这样。。。 Example
<div> 例如),文本框的宽度最大?

当然,额外的 div table 允许但不鼓励。

1 回复 | 直到 12 年前

kbrimington 14 年前

使用基于表格的方法,您可以:

<table cellspacing="0" cellpadding="0" width="100%">
    <tr>
        <td><input type="text" style="width:100%"/></td>
        <td style="width:60px"><input type="button" style="width:100%"/></td>
    </tr>
</table>

其效果是一个填充其父宽度的表,其中包含一个固定宽度按钮,该按钮与填充剩余宽度的文本框相邻。

当然,出于习惯,我会将CSS重构成一个外部文件。

编辑:

碰巧这些基于div的方法在ie7和IE8中运行得很好,但在Firefox中却不行

<div> <div style="float:right; width:60px"> <input type="button" style="width:100%"/> </div> <div> <input type="text" style="width:100%"/> </div> <div style="clear:both"></div> </div>

或许还有一种更轻松的基于div的方法:

<div> <input type="button" style="float:right; width:60px"/> <input type="text" style="width:100%"/> <div style="clear:both"></div> </div>

我推荐基于div的浏览器测试方法。

推荐文章

YunusoviÄ · 我无法用css更改html段落颜色

1 年前

Blake · 无法使用CSS旋转Angular 15中的字体图标

1 年前

Maarten -Monica for president · 将图像放在锚点标记内时调整网格中的图像大小

1 年前

Phil Lucks · 如何制作边界的外半径?

1 年前

roy_meir · 创建自定义下拉式元素

1 年前

Community wiki · 如何为触摸设备优化网站

1 年前

Paras Chandravanshi · 为什么<ul>没有从其父<p>元素继承?

1 年前

tpetzoldt · 如何在有光泽的情况下抑制图像的抗锯齿?

1 年前

boyenec · 反应如何将css样式应用于我从api respose获得的页面的spcifc部分

1 年前

manofconstsorrow · 点击导航项目关闭汉堡菜单

1 年前