I have created this table but they way I have done it seems to be messy. I have done it using inline CSS just a test and will put it in my CSS file later. Is there a better way of formatting it? My code
<hr align="left" width="40.5%" style="border-color:black;">
<table style="border-collapse: collapse; border-top:1px solid black; border-bottom:1px solid black;">
<caption style="text-align: left; padding-bottom: 7px;"><b style="color: #0066cc;">Table 1.1</b> - Some
Physical Properties</caption>
<tr style="text-align: left;">
<th>Property</th>
<th>Using the Property to Distinguish Substances</th>
</tr>
<tr>
<td style="padding: 0px 15px 0px 0px; border-top:1px solid black;">Color</td>
<td style="border-top: 1px solid black;">Is the substance colored or colorless? What is color and
intensity?</td>
</tr>
<tr>
<td>State of Matter</td>
<td>Is it a solid, liquid or gas? If it is a solid, what is the shape of the particles?</td>
</tr>
<tr>
<td>Melting Point</td>
<td>At what temperature does the solid melt?</td>
<tr>
<td>Boiling Point</td>
<td>At what temperature does the liquid boil?</td>
</tr>
<tr>
<td>Density</td>
<td>What is the substances density?</td>
</tr>
<tr>
<td>Solubility</td>
<td>What mass of the substance can dissolve in a given volume of solvent?</td>
</tr>
<tr>
<td style="padding: 0px 20px 0px 0px;">Electric Conductivity</td>
<td>Does the substance conduct electricity?</td>
</tr>
<tr>
<td>Malleability</td>
<td>How easily can a solid be deformed?</td>
</tr>
<tr>
<td>Ductility</td>
<td>How easily can a solid be drawn into a wire?</td>
</tr>
<tr>
<td>Viscosity</td>
<td>How easily will a liquid flow?</td>
</tr>
</table>
<hr class="top-border">
One of my other issues that top
line. When I put that in CSS the line does not align left. It uses the default setting of center.