Photoshop-Cafe.de :: Dein Photoshop-Forum

Photoshop-Cafe.de :: Dein Photoshop-Forum (https://www.photoshop-cafe.de/forum/index.php)
-   Hilfestellung, Tipps und Tricks (https://www.photoshop-cafe.de/forum/forumdisplay.php?f=30)
-   -   Web-Design HTML Tabellen-Zwischenräume (https://www.photoshop-cafe.de/forum/showthread.php?t=6649)

phoenix 08.11.09 16:59

Zitat:

Zitat von phoenix (Beitrag 89297)
Nicht wunder, die mouseover Bilder hatte ich nicht mit geladen.

:whistling

dorftrottel 08.11.09 17:01

Ja, das schon, aber warum verschiebt sich dann das ganze nach unten?
Ist das weil du auch keinen onmouseout eingefügt hast?

phoenix 08.11.09 17:12

Ignorieren. Wenn die mouseover Bilder geladen würden, würde sich nichts verschieben.

G-sus 08.11.09 19:49

also ich hab das jetzt mal in meine index.html geschrieben. es hat sich zwar etwas verändert, aber wirklich besser ist es nicht geworden.

http://www.jfv.de

sirena 09.11.09 11:59

Hi

Ich hab das mal ausprobiert bei mir. Versuch es mal damit, dann müsste der Zwischenraum weg sein. :)

HTML-Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
<title>
JFV.de :: Home
</title>
</head>
<body style="background-image: url(./JFV_Grunge/index/Hintergrund.jpg);">

<table bgcolor="#00CCCC" cellpadding="0" cellspacing="0">
<tr>

<td>
<a href="./index.html"><img src="./JFV_Grunge/index/mouseover/over_0_0.jpg" onmouseover="this.src='./JFV_Grunge/index/mouseover/over_0_0.jpg'" onmouseout="this.src='./JFV_Grunge/index/menu_0_0.jpg'" style="width: 200px; height: 110px; border-width: 0px; vertical-align: bottom"></a>
</td>
<td>
<a href="./index.html"><img src="./JFV_Grunge/index/mouseover/over_0_1.jpg" onmouseover="this.src='./JFV_Grunge/index/mouseover/over_0_1.jpg'" onmouseout="this.src='./JFV_Grunge/index/menu_0_1.jpg'" style="width: 200px; height: 110px; border-width: 0px; vertical-align: bottom"></a>
</td>
<td>
<a href="./index.html"><img src="./JFV_Grunge/index/mouseover/over_0_2.jpg" onmouseover="this.src='./JFV_Grunge/index/mouseover/over_0_2.jpg'" onmouseout="this.src='./JFV_Grunge/index/menu_0_2.jpg'" style="width: 200px; height: 110px; border-width: 0px; vertical-align: bottom"></a>
</td>
<td>
<a href="./index.html"><img src="./JFV_Grunge/index/mouseover/over_0_3.jpg" onmouseover="this.src='./JFV_Grunge/index/mouseover/over_0_3.jpg'" onmouseout="this.src='./JFV_Grunge/index/menu_0_3.jpg'" style="width: 200px; height: 110px; border-width: 0px; vertical-align: bottom"></a>
</td>
<td>
<a href="./index.html"><img src="./JFV_Grunge/index/mouseover/over_0_4.jpg" onmouseover="this.src='./JFV_Grunge/index/mouseover/over_0_4.jpg'" onmouseout="this.src='./JFV_Grunge/index/menu_0_4.jpg'" style="width: 200px; height: 110px; border-width: 0px; vertical-align: bottom"></a>
</td>

</tr>

<tr>
    <td style="width: 200px; height: 110px; background-image: url(./JFV_Grunge/index/menu_1_0.jpg)"></td>
    <td style="width: 200px; height: 110px; background-image: url(./JFV_Grunge/index/menu_1_1.jpg)"></td>
    <td style="width: 200px; height: 110px; background-image: url(./JFV_Grunge/index/menu_1_2.jpg)"></td>
    <td style="width: 200px; height: 110px; background-image: url(./JFV_Grunge/index/menu_1_3.jpg)"></td>
    <td style="width: 200px; height: 110px; background-image: url(./JFV_Grunge/index/menu_1_4.jpg)"></td>
</tr>

</table>

</body>
</html>

Ich würde es persönlich aber alles eher in eine extra css Datei machen, dann bräuchte man bei Änderungen immer nur eine Datei bearbeiten und nicht alle.

G-sus 09.11.09 16:15

Hey, Wow! Danke! Es geht jetz! Aber kannst du mir auch verraten was du jetzt genau verändert hast? Bzw. was die Veränderungen im genauen bewirkt haben.

sirena 09.11.09 16:28

Super, freut mich. :)

Ich kann dir das erklären. Es ist ein bekanntes Problem, dass bei Bildern in Tabellen es so aussieht, als wenn unter dem Bild eine leere Zeile ist.
Dieses Problem kann man meistens mit vertical-align: bottom verhindern.

Wenn du den Doctype genauso hättest, wie bei phoenix,:

PHP-Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
html xmlns="http://www.w3.org/1999/xhtml">
<
head>
<
meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

dann brauchst du dieses vertical-align: bottom nicht extra mit angeben. :)

G-sus 09.11.09 17:07

Ok gut, ich werds mir für die Zukunft merken. Vielen Dank nochmal für die Hilfe!

sirena 09.11.09 17:08

Kein Problem. :)


Alle Zeitangaben in WEZ +2. Es ist jetzt 10:52 Uhr.

Powered by vBulletin® Version 3.8.7 (Deutsch)
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
©2005-2024 photoshop-cafe.de

Seite wurde generiert in 0,02237 Sekunden mit 8 Queries