输入大小属性与div的宽度属性

在我的html页面我有一个输入组件放置在div组件上方。
我想输入和div具有相同的宽度，输入有一个“大小”attribtue 30.
如果我使用div的“样式”属性与“宽度：30ch”或与“宽度： 30em“似乎不起作用，在这两种情况下，div组件都比输入组件更宽。输入大小属性与div的宽度属性

我应该使用哪个属性来使div的宽度与输入的size属性匹配？

代码：

<input type="text" readonly="yes" value="a" size="30" ID="b"> 
<div id="c" style="width : 30ch"></div>

来源

2014-12-08 The_Mundane

显示代码请 – Banzay 2014-12-08 08:50:56

的size属性设置中“字”的可见宽度，浏览器解释这两种不同的设置完全一样的宽度。支持浏览器的ch单元意味着数字的宽度0，所以它的定义非常精确，虽然它当然取决于字体。所以这两种设置宽度的方式是不可比较的。

要在与input元素完全一样宽的input元素之后创建div元素，最简单的方法是将它们包装在具有固定布局的表格中。（那些无法忍受HTML表格的人可以使用CSS表格代替。）在这种方法中，您完全不设置div元素的宽度;它从表格格式获得它的宽度。我为它设置了一些内容和背景颜色，以便元素的宽度可见。

<table style="table-layout: fixed" cellspacing=0> 
 
<tr><td><input type="text" readonly="yes" value="a" size="30" ID="b"> 
 
<tr><td><div id="c" style="background: green">Hello world</div> 
 
</table>

来源

2014-12-08 09:14:23

尝试输入在IE width属性，也格设置，再加上尽量给宽度％

HTML：

<html> 
    <input id="myinput"></input> 
    <div id="myDiv"></div> 
    </html>

CSS：

#myDiv{ 
    width:x%(set x per your requirement) 
}

来源

2014-12-08 08:52:19 Madhav

我宁愿做没有改变输入组件，只是改变了格，这可能吗？ – 2014-12-08 09:02:48

我已经删除了输入的css并进行了上面的修改，请尝试一下，让我知道它是否为您工作 – Madhav 2014-12-08 09:09:14

它会对您有所帮助吗？如果输入的大小属性是30，那么div的宽度应该是多少？ 30％？ – 2014-12-08 09:10:26

使用此功能风格为您的输入和您的DIV

input#b, div#c {width:100px;}

来源

2014-12-08 09:04:20 rejnev

输入大小属性与div的宽度属性

回答

相关问题