Til en begyndelse kunne det være noget à la:
<style type="text/css">
.tbl {
text-align: left;
vertical-align: top;
margin: 0px auto;
}
.tblSpacerRow td {
font-size: 0px;
line-height: 0px:
}
.tblHeader {
background-color: #606060;
}
.tblHeader td {
/* Det samme som din nuværende klasse 'overskrift' ... plus: */
padding: 0px 3px;
}
</style>
<div style="text-align:center">
<table class="tbl" border="0" cellpadding="0" cellspacing="0">
<tr class="tblHeader">
<td width="50" height="22">Ordre#</td>
<td>Kunde</td>
<td colspan="3" width="148">Prepress/dtp</td>
<td colspan="3" width="150">Repro</td>
<td colspan="3" width="163">Trykning</td>
<td colspan="3" width="133">Efterbehandling</td>
<td colspan="3" width="148">Levering</td>
</tr>
<tr class="tblSpacerRow">
<td width="50"> </td>
<td width="170"> </td>
<td width="103"> </td>
<td width="20"> </td>
<td width="17"> </td>
<td width="105"> </td>
<td width="25"> </td>
<td width="20"> </td>
<td width="120"> </td>
<td width="25"> </td>
<td width="20"> </td>
<td width="90"> </td>
<td width="25"> </td>
<td width="20"> </td>
<td width="105"> </td>
<td width="25"> </td>
<td width="20"> </td>
</tr>
<tr>
<td class="lr" onMouseOver="s('id_3895')" onMouseOut="h('id_3895')"> 47785<br><div class="d" style="width:40px;" id="id_3895"> <a href="oversigt.asp?mode=afslut&id=3895">Afslut</a></div></td>
<td class="lr" onMouseOver="s('id_3895')" onMouseOut="h('id_3895')"><a href="java script:k(3895);"><img src="img/k.gif" width="12" height="11" alt="" align="right" class="k"></a>HARLEY-DAV<br><span class="lilletekst">M5 konvolut med rude</span><br><img src="img/9x9.gif" width="1" height="2" alt=""></td>
<td class="lrb" onmouseover="s1(this,1,0,3895)" onmouseout="h1(this,0)"> Prepress/DTP igang<br><div class="d"> </div></td>
<td class="lm" onmouseover="s1(this,1,1,3895)" onmouseout="h1(this,1)"> ebm</td>
<td class="lm" onmouseover="s1(this,1,2,3895)" onmouseout="h1(this,2)"><img src="img/status-gul.gif" style="margin-top:4px" alt=""></td>
<td class="lrb" onmouseover="s2(this,1,0,3895)" onmouseout="h1(this,0)"> Igangsat<br><div class="d"> </div></td>
<td class="lm" onmouseover="s2(this,1,1,3895)" onmouseout="h1(this,1)"> </td>
<td class="lm" onmouseover="s2(this,1,2,3895)" onmouseout="h1(this,2)"><img src="img/status-gul.gif" style="margin-top:4px" alt=""></td>
<td class="lrb" onmouseover="s3(this,1,0,3895)" onmouseout="h1(this,0)"> Igangsat<br><div class="d"> </div></td>
<td class="lm" onmouseover="s3(this,1,1,3895)" onmouseout="h1(this,1)"> ebm</td>
<td class="lm" onmouseover="s3(this,1,2,3895)" onmouseout="h1(this,2)"><img src="img/status-gul.gif" style="margin-top:4px" alt=""></td>
<td class="lrb" onmouseover="s4(this,1,0,3895)" onmouseout="h1(this,0)"> Igangsat<br><div class="d"> </div></td>
<td class="lm" onmouseover="s4(this,1,1,3895)" onmouseout="h1(this,1)"> ebm</td>
<td class="lm" onmouseover="s4(this,1,2,3895)" onmouseout="h1(this,2)"><img src="img/status-gul.gif" style="margin-top:4px" alt=""></td>
<td class="lrb" onmouseover="s5(this,1,0,3895)" onmouseout="h1(this,0)"> Igangsat<br><div class="d"> </div></td>
<td class="lm" onmouseover="s5(this,1,1,3895)" onmouseout="h1(this,1)"> ebm</td>
<td class="lm" onmouseover="s5(this,1,2,3895)" onmouseout="h1(this,2)"><img src="img/status-gul.gif" style="margin-top:4px" alt=""></td>
</tr>
<tr>
<td class="mr" onMouseOver="s('id_4649')" onMouseOut="h('id_4649')"> 47784<br><div class="d" style="width:40px;" id="id_4649"> <a href="oversigt.asp?mode=afslut&id=4649">Afslut</a></div></td>
<td class="mr" onMouseOver="s('id_4649')" onMouseOut="h('id_4649')"><a href="java script:k(4649);"><img src="img/k.gif" width="12" height="11" alt="" align="right" class="k"></a>ÆLDRE SLAN<br><span class="lilletekst">Div. tryksager</span><br><img src="img/9x9.gif" width="1" height="2" alt=""></td>
<td class="mrb" onmouseover="s1(this,1,0,4649)" onmouseout="h1(this,0)"> Afventer manus<br><div class="d"> </div></td>
<td class="mm" onmouseover="s1(this,1,1,4649)" onmouseout="h1(this,1)"> </td>
<td class="mm" onmouseover="s1(this,1,2,4649)" onmouseout="h1(this,2)"><img src="img/status-roed.gif" style="margin-top:4px" alt=""></td>
<td class="mrb" onmouseover="s2(this,1,0,4649)" onmouseout="h1(this,0)"> Afventer file<br><div class="d"> </div></td>
<td class="mm" onmouseover="s2(this,1,1,4649)" onmouseout="h1(this,1)"> </td>
<td class="mm" onmouseover="s2(this,1,2,4649)" onmouseout="h1(this,2)"><img src="img/status-roed.gif" style="margin-top:4px" alt=""></td>
<td class="mrb" onmouseover="s3(this,1,0,4649)" onmouseout="h1(this,0)"> Afventer plader<br><div class="d"> </div></td>
<td class="mm" onmouseover="s3(this,1,1,4649)" onmouseout="h1(this,1)"> </td>
<td class="mm" onmouseover="s3(this,1,2,4649)" onmouseout="h1(this,2)"><img src="img/status-roed.gif" style="margin-top:4px" alt=""></td>
<td class="mrb" onmouseover="s4(this,1,0,4649)" onmouseout="h1(this,0)"> Afventer trykark<br><div class="d"> </div></td>
<td class="mm" onmouseover="s4(this,1,1,4649)" onmouseout="h1(this,1)"> </td>
<td class="mm" onmouseover="s4(this,1,2,4649)" onmouseout="h1(this,2)"><img src="img/status-roed.gif" style="margin-top:4px" alt=""></td>
<td class="mrb" onmouseover="s5(this,1,0,4649)" onmouseout="h1(this,0)"> Afventer opgave<br><div class="d"> </div></td>
<td class="mm" onmouseover="s5(this,1,1,4649)" onmouseout="h1(this,1)"> </td>
<td class="mm" onmouseover="s5(this,1,2,4649)" onmouseout="h1(this,2)"><img src="img/status-roed.gif" style="margin-top:4px" alt=""></td>
</tr>
<!--osv.osv.osv.osv.osv.-->
</table>
---------------------------------
Derudover bør der stadig gøres en hel bunke. De sidste 9x9.gif'er (et filnavn skal i øvrigt altid begynde med et bogstav) bør helt klar udryddes. For hvert eneste billede på siden foretager browseren et kald til serveren (også selvom det er cached)!
style="margin-top:4px" bør sættes i CSS. Evt. som:
TABEL_RÆKKE_KLASSE td img {
margin-top: 4px;
}
Så behøver du kun sætte en klasse på rækken.
Derudover er det noget rod med alle de klasser på cellerne. Det må kunne gøres mere elegant.
Din brug af divs og spans kan sikkert også begrænses yderligere og alle dine bør slettes og erstattes af noget padding/margin.
Derudover ville jeg nok forssøge at sætte så mange event-handlers som muligt via JavaScript - i stedet for at skrive dem ind i koden.
Dine links, der ligger på dine k.gif'er bør også erstattes af nogle onclick-handlers på billederne.
Til aller sidst bør hele koden køres op på én lang linie - hvilket er let nok, hvis den køres ud fra en DB.
Det aller vigtigste er, at du er god til CSS. Så kan du skrive en god og kompakt kode. Ellers bliver det uvilkårligt noget skidt.
Ny bruger
Nybegynder
Opret
Preview
