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

问题描述：

我一直在玩这个试图得到我喜欢这种形式的布局..我以为我有我喜欢的东西，但在输入的第一行格式化后搞砸了，我不知道什么即时通讯做错了。。为什么我的输入在第一个输入后碰到下一行？

<!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>

请问您是否可以尝试将它更详细地解释一下 - 当我尝试您的代码时，一切看起来都很正确http：// dabblet.com/gist/3157403 – Ana 2012-07-21 22:27:48

@Ana看看电话号码是如何在两个文本输入之间而不是在第二个输入的左侧？在左边应该有标签文本，并且在每行上都有输入到右边的文本 – 2012-07-21 22:58:41

答

我认为你必须在你的CSS一个错字：

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

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

非常感谢。我在发现错别字时感到非常不满。哈哈。 – 2012-07-22 00:53:47

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

相关推荐