Question

我一直在玩这个尝试获得我喜欢这种形式的布局..我认为我有一些我喜欢的东西，但在第一行输入后格式化搞砸了我不知道我做错了什么..

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Add Company</title>
<style>
    /* Style for add_client form */
    fieldset#add_field {
        width:830px;
    }

    fieldset#Basic_Info, fieldset#Address {
        width: 46%;
        float:left;
    }

    fieldset lebel {
        float: left;
        width: 45%;
    }

    fieldset label, label span { 
        display: block; 
        padding-bottom: .25em;
    }

    fieldset#add_field span {
        float: left;
        text-align: right;
        width: 44%;
    }

    fieldset#add_field input {
        float: right;
        width: 44%;
        border-width: 1px;
        border-style: solid;
    }

    fieldset#add_field select {
        float: right;
        width: 45%;
    }
</style>
</head>
<body>
<div id='content'>
    <fieldset id='add_field'>
        <legend>Add Company</legend>

        <fieldset id='Basic_Info'>
            <legend>Basic Info</legend>

            <label for="name"><span>Company Name</span><input id="name" /></label>
            <label for="phone"><span>Phone Number</span><input id="phone" /></label>
            <label for="status"><span>Status</span>
                <select id='status'>
                    <option>1. Lead</option>
                    <option>2. Initial Contact</option>
                    <option>3. Negotiation</option>
                    <option>4. Client</option>
                    <option>5. Previous Client</option>
                </select>
            </label>
        </fieldset>

        <fieldset id='Address'>
            <legend>Address</legend>

            <label for="county"><span>Street Address</span><input id="county" /></label>
            <label for="city"><span>City</span><input id="city" /></label>
        </fieldset>

    </fieldset> 
    <input style='margin-top: 20px;' type="submit" value="Submit" id='jqxSubmitButton' />
</div>
</body>
</html>

Answer 1

我认为你的CSS中有一个拼写错误：

fieldset lebel {
    float: left;
    width: 45%;
}

lebel应为label。看看这是否解决了浮动问题。（我无法复制/粘贴您的代码。请尝试下次链接到jsfiddle设置）

为什么我的输入会在第一行之后碰到下一行？

1 个答案: