✔ Code für Höhe bei IE

Status
Nicht offen für weitere Antworten.
M

Ma-Ju

Grünschnabel
Hi! Ich hab bei meinem Projekt ein Problem. Und zwar sollen die Events in einer Liste ausgegeben werden. Auf der linken Seite sind die Thumbs, auf der rechten Seite die Details mit einem Bild. Diese Details haben einen grauen Hintergrund. Die Tabelle reicht nicht über die ganze Höhe des Thumbs. Da der Thumb unterschiedlch hoch sein kann, muss die Höhenangabe in Prozent sein. Mit dem Firefox klappt alles ohne Probleme, nur im IE spinnt das ganze mal wieder... Hier der Quellcode vom Template:

PHP: 
<table style="height:100%;" width="100%" border="0" cellpadding="0" cellspacing="0">
    <tr bgcolor="#ececec">
        <td colspan="2" style="font-weight:bold;">$eventtitle - $eventdate</td>
    </tr>

    <tr>
        <td width="150">
            <a href="images/flyer/$eventflyer"><img src="thumbs.php?img=images/flyer/$eventflyer" border="0" alt="Flyerthumb für $eventtitle" title="Flyerthumb für $eventtitle"></a>
        </td>
        <td valign="top">
            <table bgcolor="#d7d7d7" width="100%" border="0" cellpadding="0" cellspacing="0" height="100%">
                <tr>
                    <td>Einlass:</td><td>$eventopen Uhr</td>
                </tr>

                <tr>
                    <td>Ort:</td><td>$eventloc</td>
                </tr>

                <tr>
                    <td>Preis:</td><td>$eventprice Euro</td>
                </tr>

                <tr valign="bottom">
                    <td colspan="2" width="100%"><a href="?$config[switchvar]=events&$config[contentvar]=details&id=$eventid"><img src="images/cboxes/c_content_eventdetail.jpg" border="0" alt="zu den Details" title="zu den Details"></a></td>
                </tr>
            </table>
        </td>
    </tr>

    <tr>
        <td colspan="2" style="background-image: url(./images/trenndot.gif); background-repeat: repeat-x;" height="1"><img src="./images/Abstandhalter.gif" alt="" border="0" height="1"></td>
    </tr>
</table>

Außerdem ist um das Bild unten und rechts ein kleiner Rahmen. Im Template sind die Border-Werte auf 0. Hier mal ein Screen

http://www.onlinepictures.de/2/uploads/Unbenanntdaa5bb3bJPG.jpg

Ich hoffe, mir kann einer helfen! :)
 
Ma-Ju hat gesagt.:
Diese Details haben einen grauen Hintergrund. Die Tabelle reicht nicht über die ganze Höhe des Thumbs. Da der Thumb unterschiedlch hoch sein kann, muss die Höhenangabe in Prozent sein. Mit dem Firefox klappt alles ohne Probleme, nur im IE spinnt das ganze mal wieder...
Zum Vergrößern anklicken....
Bestimme doch für die übergeordnete Tabelle die gewünschte Hintergrundfarbe:

HTML: 
<table style="height:100%;background:#d7d7d7;" width="100%" border="0" cellpadding="0" cellspacing="0">

Ma-Ju hat gesagt.:
Außerdem ist um das Bild unten und rechts ein kleiner Rahmen. Im Template sind die Border-Werte auf 0.
Zum Vergrößern anklicken....
Entferne die Leerzeichen bzw. Zeilenumbrüche (= whitespaces) im HTML-Quelltext:

HTML: 
<td width="150"><a href="http://www.tutorials.de/forum/images/flyer/$eventflyer"><img src="thumbs.php?img=images/flyer/$eventflyer" border="0" alt="Flyerthumb für $eventtitle" title="Flyerthumb für $eventtitle"></a></td>
oder notiere folgende CSS-Regel im Stylesheet:

CSS: 
img { 
display:block;
}
 
Sorry, das ging aus deinem Eingangsposting nicht klar hervor. Hier mein Lösungsvorschlag:

HTML: 
<table style="height:100%;background:#d7d7d7;" width="100%" border="0" cellpadding="0" cellspacing="0">
    <tr bgcolor="#ececec">
        <td colspan="3" style="font-weight:bold;">$eventtitle - $eventdate</td>
    </tr>
    <tr>
        <td width="150" rowspan="4"><a href="http://www.tutorials.de/forum/images/flyer/$eventflyer"><img src="thumbs.php?img=images/flyer/$eventflyer" border="0" alt="Flyerthumb für $eventtitle" title="Flyerthumb für $eventtitle"></a></td>
        <td>Einlass:</td><td>$eventopen Uhr</td>
    </tr>
    <tr>
        <td>Ort:</td><td>$eventloc</td>
    </tr>
    <tr>
        <td>Preis:</td><td>$eventprice Euro</td>
    </tr>
    <tr>
        <td colspan="2" width="100%" valign="bottom"><a href="?$config[switchvar]=events&$config[contentvar]=details&id=$eventid"><img src="http://www.tutorials.de/forum/images/cboxes/c_content_eventdetail.jpg" border="0" alt="zu den Details" title="zu den Details"></a></td>
    </tr>
    <tr>
        <td colspan="3" style="background-image: url(./images/trenndot.gif); background-repeat: repeat-x;" height="1"><img src="./images/Abstandhalter.gif" alt="" border="0" height="1"></td>
    </tr>
</table>
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück