PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Verschachtelung von Tabellen... was mach ich falsch?

HiddenGhost
2003-10-11, 21:27:33
Ich versuche mich gerade an einer Verschachtelung von Tabellen, gemäß der angehängten Skizze. Ich hab allerdings scheinbar einen denkfehler in der ganzen Überlegung.

Um den Plan der Skizze gemäß umzusetzen muss ich was ändern?

//EDIT: Über den miesen Code, der hier stand, bin ich hinaus...von daher fliegt er jezz raus... :D

--> ich werd ja richtig poetisch...
Nase
2003-10-11, 22:04:59
Meinst du nicht auch, dass du mit deutlich weniger Tabellen auskommst ?
Aqualon
2003-10-11, 22:20:06
Finde auch, dass das ein paar Tabellen zuviel sind. Ansonsten immer von aussen nach innen gehen. Die äusserste Tabelle erstellen und in die betreffenden TD-Tags die nächstinneren Tabellen erzeugen (usw...).

Aqua
Nase
2003-10-11, 22:22:53
Hab mal auf die Schnelle was zusammengezaubert, ist zwar nicht schön, aber ich denke es erfüllt seinen Zweck. Ob noch Fehler drin sind weiss ich nicht.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN">
<html>
<head>
<title>Grundgerüst</title>
</head>
<body>

<table width="800" border="1">
<tr>
<td colspan="2">

1 "Titel mit Banner"

</td>
</tr>

<tr>
<td width="15%">

2 "linkes Menu"

</td>

<td width="85%">


<table width="100%" border="1">
<tr>
<td colspan="2" width="66%">

3

</td>
<td rowspan="3" width="33%">

6 "rechter Balken"

</td>
</tr>

<tr>
<td colspan="2" width="66%">

4

</td>
</tr>

<tr>
<td>

5.1

</td>
<td>

5.2

</td>
</tr>

<tr>
<td colspan="3">

7

</td>
</tr>

<tr>
<td colspan="3">

8

</td>
</tr>


</table>

</td>
</tr>
</table>
</body>
</html>
HiddenGhost
2003-10-11, 23:05:17
Damit wird aber nicht das Problem gelöst, dass ich unbedingt die Felder 3+4+5.1+5.2 und dann mit cellspacing haben möchte, nicht aber feld 6... daher hab ich auch so viele tabellen eingebaut.

also 6 direkt nahtlos an 1 und 7
Nase
2003-10-11, 23:10:01
Dann packst du an den Stellen wo du Cellpadding brauchst halt ein bisschen CSS-Style rein.

style="padding: 10px" einfach in den <td>-Tag schreiben.
HiddenGhost
2003-10-13, 13:10:31
Danke euch, bisher hat alles so geklappt wie ihr es mir empfohlen habt.

Ich parke das teil mal vorerst hier (http://www.ewetel.net/~guenter.kayser/projekt.htm)

Wieso richtet sich das Bild neben der Tabelle 7 icht richtig bis an den Rand aus?
Nase
2003-10-13, 13:31:01
Setzt das mal auf cellspacing="0"
HiddenGhost
2003-10-13, 14:48:06
An welcher Stelle muss ich das denn setzen, damit das funktionert.

Mitlerweile hab ich jeden td tag und jede tabelle ausprobiert...

du kannst mir nicht zufällig einen guten Texteditor empfehlen? ;)
Nase
2003-10-13, 14:57:59
Das muss in den <table>-Tag. Sorry, hatte ich vergessen zu erwähnen :)

Bei HTML-Editoren kenne ich mich nicht aus, ich benutze fast ausschliesslich Notepad bzw. Homesite, aber keine WYSIWYG-Editoren.
HiddenGhost
2003-10-13, 15:42:14
Original geschrieben von Nase
Das muss in den <table>-Tag. Sorry, hatte ich vergessen zu erwähnen :)

Bei HTML-Editoren kenne ich mich nicht aus, ich benutze fast ausschliesslich Notepad bzw. Homesite, aber keine WYSIWYG-Editoren.

Nene, reine Texteditoren. Mit Dreamweaver hab ich es auch mal ne Zeitlang probiert, aber da kam viel zu viel überflüssiger Code raus...

Das funktioniert irgenwie nicht! diese Lücke rechts und über dem Bild ist anch wie vor vorhanden!


<table cellspacing=0px>
<tr>
<td colspan="3" width="633">
<div class="bild">
<img src="./bilder/balkenunten.gif" align=right alt="" >

<table width="400" cellspacing=20px> |--> betrifft nicht das Bild!
<tr class="white">
<th></th>
<td>7<br>.<br>.<br>.<br>.<br>.br>.
</td>
</tr>
</table>

</div>
</td>
</tr>
</table
Nase
2003-10-13, 15:44:36
Hatte ich nicht gesagt, das cellspacing="0" muss in den <table>-Tag und nicht in den <td>-Tag?
HiddenGhost
2003-10-13, 15:51:28
ja, ich habs auch grad edetiert... funzt trotzdem nicht!

//edit... ich will echt nicht nerven... aber ich kenn micht mit sauberem coden echt noch nicht so aus!

btw. der div tag:div.bild { margin-right:0px; }
Nase
2003-10-13, 15:58:34
Wäre es möglich, dass du deinen Code etwas dokumentierst? Die großen Einrückungen machen das nicht wirklich übersichtlicher.
HiddenGhost
2003-10-13, 16:05:27
wie du meinst... aber das Problem ist ja, dass das Bild sich einfach nicht richtig ausrichten läßt!
Nase
2003-10-13, 16:06:38
Wenn ich die betreffenden Stellen im Code finden könnte, dann wäre eine Lösung auf dein Problem nicht in weiter Ferne :)
HiddenGhost
2003-10-13, 16:16:18
Original geschrieben von Nase
Wenn ich die betreffenden Stellen im Code finden könnte, dann wäre eine Lösung auf dein Problem nicht in weiter Ferne :)

So, hab Quellcode mit Dokumentation überarbeitet! Hast recht, das macht es insgesamt deutlich übersichtlicher :D.

//Edit: Shit, Mozilla zeigt den Inhalt des Stylesheets nicht an, bzw rendert nurdie Tabellen.
In Opera funktioniert die Seite erwartungs gemäß, any hints??
W3C sagt, dass der Cod eso html 4.01 valid ist, deshalb versteh ich auch nicht, wieso das nicht klappt.
Nase
2003-10-13, 17:35:06
Für die CSS Datei gehörst du auch geschlagen =) . Da ist ja alles falsch drin.

Und warum nimmst du eigentlich nicht meinen Vorschlag an, nur mit wenigen Tabellen zu arbeiten?
HiddenGhost
2003-10-13, 17:58:26
Weil ich in den weißen Kästen eigen Hintergründe defenieren will, das aber vor den linierten Hintergrund setzen zu gedenke. Ich weiß da keine andere Lösung für.
Die eißen Rechtecke sind also im GRunde platzhalter, die mit weiteren <th><tr> und <td> Tags gefüllt werden wollen.

Ich mache jetzt wirklich das erste mal eine Page ohne WYSIWYG-Editor und bin scheinbar arg aufgeschmissen. Ich hoffe, ich stehle dir nicht deine ganze Zeit damit.

Was ist denn falsch an der css-datei ??? :kratz:
Nase
2003-10-13, 18:15:21
Ich mache dir einen Vorschlag. Du zeichnest jetzt ein Bild davon, wie du dir die Seite vorstellst und ich werde das dann mal umsetzen.
HiddenGhost
2003-10-13, 18:42:14
Im Grunde so, wie die Seite bereits aussieht. Das graue entspicht dem linienmuster, das ich in den Hintergrund gelegt habe.

Mein Problem ist, die Ecke der Zierleiste rechts mit Tabelle 6 zu optisch verschmelzen.
Nase
2003-10-13, 19:37:55
Hmmm, naja, mal eben was auf die Schnelle:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Grundger&uuml;st</title>
</head>

<body>

<table width="750" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="3">
<img src="logoS.jpg" alt="">
</td>
</tr>

<!-- Menu -->
<tr>
<td width="117" valign="top" rowspan="2">
<b>Das Menu</b>
</td>
<!-- Menu ENDE -->

<!-- Mittelteil -->
<td rowspan="2" style="background-image:url(background.gif);">
<br>

<!-- neue Tabelle fuer den Content -->
<table width="90%" border="1" cellspacing="10" cellpadding="10" align="center">
<tr>
<td colspan="2">
erste Spalte, erste Reihe
</td>
</tr>

<tr>
<td colspan="2">
erste Spalte, zweite Reihe
</td>
</tr>

<tr>
<td width="50%">
erste Spalte, dritte Reihe
</td>
<td width="50%">
zweite Spalte, dritte Reihe
</td>
</tr>

<tr>
<td colspan="2">
erste Spalte, vierte Reihe
</td>
</tr>

<tr>
<td colspan="2">
erste Spalte, fuenfte Reihe
</td>
</tr>

</table>
<!-- neue Tabelle fuer den Content ENDE -->
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</td>
<!-- Mittelteil ENDE -->

<!-- Designelement rechts -->
<td width="125" align="right" valign="bottom" style="background-image:url(balkenrechts.gif); background-repeat: repeat-y; height: 100">

</td>
</tr>

<tr>
<td width="125" style="background-image:url(balkenunten.gif); background-repeat: no-repeat; height: 125">

</td>
<!-- Designelement rechts ENDE -->

</tr>
</table>

</body>
</html>

Ich hoffe, das hilft dir ein wenig weiter.

P.S.: Die vielen <br>'s sind nur dazu da, um das ganze ein wenig in die Länge zu ziehen. Wenn in den Tabellen erstmal Inhalt drin ist, können die wieder weg.
HiddenGhost
2003-10-15, 00:18:39
Danke, das werd ich mir in den nächsten Tagen mal ansehn.
Ich glaub ich sollte nochmal back to the roots gehen und alles von der Pieke auf neulernen...