I was unable to align the thead(head level) check box ‘managersSelected’ to left (OR) align the row level check boxes to center with out changing the global CSS in the head section. I want to add inline style element to align the checkboxes.
Any thoughts?
Here is the code for html pag
<html>
<head>
<style>
<!--
table.mgr-table {
text-align: left;
padding: 10px;
border: 1px solid #8C6B3E;
width: 100%
}
table.mgr-table th, table.mgr-table td {
padding: 5px;
}
table.mgr-table thead tr {
background-color: #EFEFE7;
color: #7A481B;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 3px;
padding-right: 3px;
border-bottom: #8C6B3E 1px solid;
border-left: #CECCB6 1px solid;
border-right: #FFFFFF 2px solid;
text-align: center;
}
table.mgr-table th.sorted {
padding-right:20px;
}
table.mgr-table th.sortable a {
white-space: normal;
}
table.mgr-table th.order1 {
background-image: url(../images/ascending.gif);
background-repeat: no-repeat;
background-position: right;
}
table.mgr-table th.order2 {
background-image: url(../images/descending.gif);
background-repeat: no-repeat;
background-position: right;
}
table.mgr-table tr.odd {
background: url("../images/table_blue_row_bg.gif") repeat-x top #d3e1f0;
}
table.mgr-table tr.tableRowEven,table.mgr-table tr.even {
background: #FFFFFF;
}
table.mgr-table tr.odd td {
padding: 5px;
border-left: #D3E1F0 1px solid;
border-right: #D3E1F0 0px solid;
vertical-align: top;
}
table.mgr-table tr.even td {
background: #FFFFFF;
border-left: #FFFFFF 1px solid;
border-right: #FFFFFF 0px solid;
padding: 5px;
vertical-align: top;
}
-->
</style>
</head>
<body>
<div id="table_wrapper">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<h3>Add Managers</h3>
<tr>
<td>
<table class="mgr-table" id="managerTable">
<thead>
<tr>
<th><input type='checkbox' name='managersSelected' id='managersSelected' onClick='toggleCheckboxes();'/></th>
<th>Name</th>
<th>Phone</th>
</tr>
</thead>
<tbody>
<tr class="odd">
<td><input name="selectedName" type="checkbox" value="1234"/></td>
<td>MICHAEL MOORE</td>
<td>(573) 747-9447</td>
</tr>
<tr class="even">
<td><input name="selectedName1" type="checkbox" value="7658"/></td>
<td>RICK BALBOA</td>
<td>(572) 742-9447</td>
</tr>
</tbody>
</table>
</td>
</tr >
</table>
</div>
</body>
</html>