So reduzieren Sie den Abstand zwischen tr?
Ich versuche zu replizieren, eine Seite, die ich erhalten habe, und ich habe fast fertig, aber ich habe ein kleines problem mit ihm.
Den Raum zwischen den tr zu groß sind. Ich habe es getan Verringerung der Rand oben und unten, aber es gibt einen Punkt, wo die Zeilen sich überlappen.
Hat jemand irgendwelche Vorschläge haben?
z.B.
<style type="text/css">
.divContainer
{
margin:10px;
background-color:#C7D8EE;
border:2px solid #0076BF;
text-align:left;
}
.tableContainer
{
color:#0076BF;
margin: -10px 0px -10px 0px;
border-spacing: 10px;
empty-cells:show;
width:90%;
}
.tableContainer tr td{
white-space:nowrap;
}
.tableContainerRow2{
background-color:white;
border:2px solid #0076BF;
}
</style>
<div class="divContainer">
<table class="tableContainer" cellspacing="10px">
<tr>
<td>NHS Number</td>
<td> </td>
<td>Date of Visit</td>
<td> </td>
<td colspan="3">Care Time Started</td>
<td> </td>
<td> </td>
<td rowspan="2" style="font-weight:bold;vertical-align:middle;">Tick when<br/> care starts</td>
</tr>
<tr >
<td width="90" class="tableContainerRow2"> 0123456789</td>
<td > </td>
<td width="80" class="tableContainerRow2"> 12/12/09</td>
<td > </td>
<td width="40" class="tableContainerRow2"> 12</td>
<td width="5">:</td>
<td width="40" class="tableContainerRow2"> 10</td>
<td > </td>
<td style="text-align:right" > ☑</td>
</tr>
</table>
<table class="tableContainer" cellspacing="10px" >
<tr>
<td></td>
<td>Initials</td>
<td>Surname</td>
</tr>
<tr>
<td width="80" style="font-weight:bold;">Midwife</td>
<td width="50" class="tableContainerRow2"> </td>
<td class="tableContainerRow2"> </td>
</tr>
<tr>
<td></td>
<td>Initials</td>
<td>Surname</td>
</tr>
<tr>
<td style="font-weight:bold;">Doctor</td>
<td class="tableContainerRow2"> </td>
<td class="tableContainerRow2"> </td>
</tr>
</table>
<table class="tableContainer" cellspacing="10px" >
<tr>
<td width="250">Forename</td>
<td>Surname</td>
</tr>
<tr>
<td class="tableContainerRow2"> </td>
<td class="tableContainerRow2"> </td>
</tr>
</table>
<table class="tableContainer" cellspacing="10px" >
<tr>
<td width="90">Date of Birth</td>
<td width="150"></td>
<td width="100">Casenote No:</td>
<td></td>
</tr>
<tr>
<td class="tableContainerRow2"> </td>
<td></td>
<td class="tableContainerRow2"> </td>
<td></td>
</tr>
</table>
</div>
Du musst angemeldet sein, um einen Kommentar abzugeben.
Entfernen
cellspacing="10px"
von der<table>
und verwenden nur CSS. Sie bereits haben, definiert es mitborder-spacing: 10px;
.border-spacing
Sie können auch einfach eine unsichtbareborder
auftd
Elemente undborder-collapse: collapse
auf dietable
element.