Having trouble aligning a field set within a div. The first two elements are centered right next to each other, but the third one is justified left and I'm struggling to center it within the div.
JSP
<tr>
<th>
<span onclick="toggleDiv('rollupGranularity', 'rollImg')" style="cursor: hand;">Data Structure <img name="rollImg" src="../images/minus.gif" /></span>
</th>
</tr>
..
CSS:</p>
<pre><code>/* Styles for Data Extraction tool */
table.data_extract
{
border: 3px DarkGray solid;
border-collapse: collapse;
}
td.data_extract,
table.data_extract > tbody > tr > td {
border-color : DarkGray;
..
}
..
fieldset.det
{
display:block;
float:left;
font-family:Verdana, Arial, Helvetica, sans-serif;
..
}
fieldset.det legend {
padding:2px 5px;
border:2px solid #CCCCCC;
font-weight: bold;
background-color: #FFFFDD;
}
div.det {
display:block;
background-color: #FFFFDD;
text-align: center;
width: 100%;
margin: auto;
}