如何设置多个元素的样式以将它们固定为100%宽度?

时间:2018-06-02 06:53:59

标签: html5 css3

我有这段代码

...
<div>
    <label>Identification:</label>
    <input type="text" name="identification" value="" maxlength="20">
    <strong class="characters">20</strong>
    <p class="description">
        <span class="icon_description"></span>Item description
    </p>
</div>
...

现在它看起来像这个图像 enter image description here

我需要将其提高到100%的父元素。 因此label可以固定到特定宽度,其余元素可以固定到宽度空间的其余部分。 如何通过css3为跨浏览器做到这一点?

1 个答案:

答案 0 :(得分:0)

嗨,我更正了一些代码。以下代码可在所有浏览器中使用。

<!Doctype>
<html>

<body>
<div style="width:500px;margin-top:40px;">
<label style="width:86px;float:left;">Identification:</label>

    <div  style="width:404px;float:right;margin-left:10px;">
    <input type="text" name="identification" value="" maxlength="20"    style="width:45%;">
    <strong class="characters"  style="width:10%;">40</strong>
    <h4 style="width:45%;float:right;margin-top:0px;">Item description</h4>
    </div>
</div>
</body>
</html>