HTML textbox not working

Question

Это простая проблема, но я не могу ее решить. Я не могу нажать на текстовое поле и заставить его работать.
Пожалуйста, обратитесь к моей скрипке здесь: http://jsfiddle.net/5JeaQ/

HTML:

<div id="container"> 
    <div id="form"> 
     <form id="lookup" method="post"> 
      <fieldset> 
       <legend>Phone Directory</legend> 
       <input type="text" id="name" placeholder="Enter name.." autocomplete="off"/> 
       <span id="buttons"> 
        <input type="submit" id="submit" value="Submit"/> 
        <input type="button" id="list_all" value="List All"/> 
       </span> 
      </fieldset> 
     </form> 
    </div> 
    <div id="results"></div> 
</div> 

CSS:

#container{ 
    width: 30%;    
    margin: 0 auto; 
    /*text-align: center;*/ 
}   
#name{ 
    display: block; 
    /*margin: 0 auto;*/ 
} 
#buttons{ 
    padding-top: 25px; 
} 
fieldset{ 
    border-radius: 10px; 
} 
td{ 
    text-align: center; 
} 

Answer 1

Ваши кнопки имеют отступ сверху. Почему это? Кажется, он ничего не делает, и его устранение устраняет вашу проблему.

fiddle

CSS:

#container{ 
    width: 30%;    
    margin: 0 auto; 
    /*text-align: center;*/ 
}   
#name{ 
    display: block; 
    /*margin: 0 auto;*/ 
} 

fieldset{ 
    border-radius: 10px; 
} 
td{ 
    text-align: center; 
} 
/*legend{ 
text-align: center; 
}*/ 

Answer 2

Удалить этот

#buttons{ 
    padding-top: 25px; 
} 

Working Fiddle

Answer 3

попробовать этот

#buttons{ 
padding-top: 0px; 

}

Demo

http://jsfiddle.net/5JeaQ/8/