隱藏的瀏覽按鈕正在搞亂我的表

Question

我正在嘗試製作一個浮動菜單，該按鈕位於屏幕頂部，並且有幾個圖標可供您點擊，其中大部分圖標都會提交表單。儘管如此，filechoose按鈕通過CSS隱藏，但即使它不是呈現，它仍然會導致我的下載按鈕消失在屏幕外。我怎樣才能解決這個問題？

感謝您的任何線索

---

下面是菜單

<div id='floating_menu'> 
    <table > 
     <tr> 
      <td > 
       <form action='' method='post' id='trash1' > 
        <img src='http://s27.postimg.org/jua3mu9q9/trash.jpg' width="35" height="45" alt='delete' /> 
       </form> 
      </td> 
      <td > 
       <img id='storagebutton' src='http://i60.tinypic.com/2igya9d.jpg' width="35" height="45" alt='storage' /> 
      </td> 
      <td > 
       <form id="uploadtsvform" enctype="multipart/form-data" method="post" action=""> 
        <input id="filechoosebutton" name="uploadFile" type="file" onchange="this.form.submit()" /> 
        <img id='uploadbutton' onClick='chooseFile()' src='http://oi59.tinypic.com/2lm0yky.jpg' width="35" height="45" alt='upload tsv' /> 
       </form> 
      </td> 
      <td > 
       <img id='downloadbutton' src='http://i62.tinypic.com/zu4n03.jpg' width="35" height="45" alt='download tsv' /> 
      </td> 
     </tr> 
    </table> 
</div> 

這裏的HTML是創建浮動菜單

#floating_menu { 
    background:white; 
    width:250px; 
    height:25px; 
    position:fixed; 
    top:10px; 
    right:0; 
} 

這裏的CSS是CSS，這隱藏通常的瀏覽上傳按鈕

#filechoosebutton { 
    height:0px; 
    width:0px; 
    overflow:hidden; 
} 

這裏是一個Fiddle

Answer 1

您的形式是吃了下載按鈕的空間。嘗試加入

#uploadtsvform { 
    display: inline-block; 
    width: 50px; 
}