André Laugks: etwas Kosmetik

Beitrag lesen

Hallo!

Netscape 3.0, 4.5 und IE 4 zeigen es alle falsch an. Ich denke deshalb, daß der Fehler bei mir liegt. Wieso sind der obere und untere Rand so hoch?

Man bekommt eine "schmalle zelle" mit etwas Kosmetik. Die Zelle ist nicht schmaller, sondern das Hintergrundbild täuscht das vor.

Hier ist mal ein Beispiel. Die Grafiken kannst Du Dir unter den URL, die ich unten angebe, runter laden. Die Grafiken habe ich eben mal schnell gemacht, also die sind nicht so genau. Ich lasse die ein paar Tage auf dem Server, fals es ein paar andere auch noch sehen möchten.

Die baust eine Grafik, z.B15x20 in die Zelle als Hintergrundbild ein. Das GIF hat einen schmallen grauen Rand. der Rest des Bildes ist transparent. Wenn man jetzt auch noch eine Hintergrundfarbe definiert, sieht man den grauen schmalen rand und die Hintergrundfarbe. Schau es Dir an, vielleicht kannst Du diesen "Trick" verwenden. Es ist keine 100% Lösung.

<HTML><BODY BGCOLOR="#000000">
<table border="0" cellpadding="0" cellspacing="0">
        <tr>
                <td width="7"   height="69" rowspan="4" bgcolor="#FF00FF">  </td>
                <td width="417" height="6"  colspan="3" bgcolor="#ff0000" BACKGROUND="oben.gif">  </td>
                <td width="5"   height="69" rowspan="4" bgcolor="#FFFFFF">  </td>
        </tr>
        <tr>
                <td height="28" width="158" bgcolor="#FF0000">  </td>
                <td height="28" width="158" bgcolor="#00FF00">  </td>
                <td height="56" width="101" bgcolor="#0000FF" rowspan="2">  </td>
        </tr>
        <tr>
                <td height="28" width="316" bgcolor="#FFFF00" colspan="2">  </td>
        </tr>
        <tr>
                <td colspan="3" height="7" width="417" bgcolor="#ffff00" BACKGROUND="unten.gif">  </td>
        </tr>
</table>
</BODY></HTML>

Ein Beispiel mal von mir.
Nehmen wir mal an, wir haben eine Zelle die ist 200 breit und 100 hoch. Du möchtest jetzt oben eine 5 Pixel schmallen Rand haben. Mit einer Zelle bekommt man das nicht hin.  Man macht sich eine Grafik 5 Pixel breit und 100 Pixel hoch(nicht weniger, sonst siehst Du den rand/Streifen auch unten.."Wiederholungseffekt"). Oben auf der Grafik zeichnet man einen Rand/Streifen von 5 Pixel, den Rest macht man transparet. Jetzt möchte man aber noch text in die zelle schreiben, dann setzt man cellpadding="7" und der text liegt nicht auf dem Rand/Streifen.

Bis dann, André
http://www.netcologne.de/~nc-laugksan/bilder/oben.gif
http://www.netcologne.de/~nc-laugksan/bilder/unten.gif