刪除JSTL內部的換行符<c:forEach>

我修改了<input type="submit">看起來像一個超鏈接。刪除JSTL內部的換行符<c:forEach>

CSS：

input[type="submit"].searchitem { 
    background: none; 
    border: none; 
    color: blue; 
    cursor: pointer; 
    padding: 0px; 
} 

input[type="submit"].searchitem:hover { 
    text-decoration: underline; 
}

JSTL：

<c:forEach var="searchItem" items="${searchResults}"> 
    <form action="view-schedule.jsp" method="post"> 
     <input type="hidden" name="movieid" value="${searchItem.movieId}" /> 
     <input type="submit" value="${searchItem.movieTitle}" class="searchitem" /> 
    </form> 
</c:forEach>

火狐督察：

<form method="post" action="view-schedule.jsp"> 

    <input type="hidden" value="4" name="movieid"></input> 
    <input class="searchitem" type="submit" value="INSURGENT"></input> 

</form> 
<form method="post" action="view-schedule.jsp"> 

    <input type="hidden" value="2" name="movieid"></input> 
    <input class="searchitem" type="submit" value="INTERSTELLAR"></input> 

</form> 
<form method="post" action="view-schedule.jsp"> 

    <input type="hidden" value="9" name="movieid"></input> 
    <input class="searchitem" type="submit" value="MINIONS"></input> 

</form> 
<form method="post" action="view-schedule.jsp"> 

    <input type="hidden" value="6" name="movieid"></input> 
    <input class="searchitem" type="submit" value="MOCKINGJAY: PART I"></input> 

</form> 
<form method="post" action="view-schedule.jsp"> 

    <input type="hidden" value="3" name="movieid"></input> 
    <input class="searchitem" type="submit" value="PENGUINS OF MADAGASCAR"></input> 

</form> 
<form method="post" action="view-schedule.jsp"> 

    <input type="hidden" value="8" name="movieid"></input> 
    <input class="searchitem" type="submit" value="WHITE BIRD IN A BLIZZARD"></input> 

</form>

輸出：

enter image description here

但它顯示搜索結果之間的空白。我不認爲我在任何地方都有<br />。

（它正在與scriptlet for-each一起工作，但我試圖轉換爲JSTL）。

來源

2014-11-21 silver

是否由於'hidden'元素的換行？你檢查過它嗎？ – OO7 2014-11-21 06:22:54

@ OO7嗨，我添加了Firefox Inspector的帖子，似乎也沒有'
'。 – silver 2014-11-21 06:31:28

是的，但是爲什麼在''元素前後有空行？你在其他瀏覽器中檢查過嗎？ – OO7 2014-11-21 06:33:12

由於沒有適用於form風格，它有margin-bottom從用戶代理樣式表 像

form { 
    margin-bottom: 1em; 
}

下面替換此爲好look

form { 
    margin-bottom: 5px; 
}

試試這個

<html> 
    <head> 
    <title>Test Line Break</title> 
    <style> 
     form{ 
      margin-bottom:5px; 
     } 
     input[type="submit"].searchitem { 
      background: none; 
      border: none; 
      color: blue; 
      cursor: pointer; 
      padding: 0px; 
     } 

     input[type="submit"].searchitem:hover { 
      text-decoration: underline; 
     } 
    </style> 
    </head> 
    <body> 
     <form method="post" action="view-schedule.jsp"> 

      <input type="hidden" value="2" name="movieid"></input> 
      <input class="searchitem" type="submit" value="INTERSTELLAR"></input> 

     </form> 
     <form method="post" action="view-schedule.jsp"> 

      <input type="hidden" value="2" name="movieid"></input> 
      <input class="searchitem" type="submit" value="INTERSTELLAR"></input> 

     </form> 
    </body> 
</html>

這就是爲什麼u得到按鈕中斷。

來源

2014-11-21 07:13:29 OO7

我加了'form {margin-bottom：0px; }'它工作。我現在也讀了關於[用戶代理styleshhet]（http://stackoverflow.com/questions/12582624/what-is-user-agent-stylesheet），感謝您的解釋。 Upvoted並標記爲接受的答案。 – silver 2014-11-21 07:29:24

只是添加到你的CSS

form { 
    margin-bottom: 0; 
}

來源

2014-11-21 07:07:22

刪除JSTL內部的換行符<c:forEach>

回答

相關問題