I have a jsp that has multiple <table>
in a page. I want only one particular table to be of fixed height and have a scrollable <tbody>
and fixed <thead>
.
For that I have written a custom CSS as a class so that I can use it in that paricular table. But its not working.
Here is the CSS:
.scroll-tbody{
display: block;
height: 460px;
overflow-y: auto;
}
And here is the JSP snippet:
<table class="table table-hover table-condensed">
<thead>
<tr>
<td><b>    Name</b></td>
<td><b>Phone</b></td>
<td><b>Total Exp.</b></td>
<td><b>Location</b></td>
<td><b>Profile Type</b></td>
<td><b>Domain</b></td>
<td><b>Assigned To</b></td>
<td><b>Status</b></td>
<td><b>Date</b></td>
</tr>
</thead>
<tbody class="scroll-tbody"> <!-- HERE IS THE CUSTOM CSS FOR SCROLLING -->
<%
if(fullList.size()>0)
{
Iterator itr = fullList.iterator();
while(itr.hasNext())
{
FileService fs = new FileService();
File prf = (File)itr.next();
String prfData = prf.getAbsolutePath() + "#";
prfData += fs.readData(prf.getAbsolutePath(),"","profiledata");
prfData = prfData.replace("\\","/");
String[] data = prfData.split("#");
String name = data[1].replace("_"," ");
String phone = data[2];
String totExp = data[3];
String location = data[5];
String prfType = data[6];
String domain = data[7];
String assignedTo = data[8];
String status = data[9];
String prfDate = data[12];
prfData = prfData.replace("'","\\'");
prfData = prfData.replace("\"","\\'");
prfData = prfData.replace("\r\n","^");
System.out.println("---->JSP Data: "+prfData+"\n");
session.setAttribute("dataToEdit",prfData);%>
<tr>
<td><a data-toggle="modal" data-target="#editProfileModal" onClick="getData('<%=prfData%>')"><i class="fa fa-fw fa-file"></i><font size="2"><%=name%></font></a></td>
<td><font size="2"><%=phone%></font></td>
<td><font size="2"><%=totExp%></font></td>
<td><font size="2"><%=location%></font></td>
<td><font size="2"><%=prfType%></font></td>
<td><font size="2"><%=domain%></font></td>
<td><font size="2"><%=assignedTo%></font></td>
<td><font size="2"><%=status%></font></td>
<td><font size="2"><%=prfDate%></font></td>
</tr>
<% }
} %>
</tbody>
</table>
I dont want to write the CSS like: table{...} thead{...} tbody{...}
as it will impact all the tables present in that page.
Am I missing something?
Thanks in advance.