Positionsangabe relativ/absolut zu einer Tabellenzelle
guelcki
- css
Hallo allerseits!
Habe ein kleines/großes Problem (weiß auf jeden Fall keine Antwort), und zwar habe ich ein Homepage mit einer großen Tabellenzelle (mit kleineren in ihr), die in der Mitte des Bildschirms sein soll, designd.
Jetzt nähere ich mich langsam meinem Problem:
Ich möchte ein Div an einer einzelnen dieser Zellen ausrichten.
z.B.: <table><tr><td><div id="zelle">Testtext</div>...
und in der css Datei: #zelle {position: relative; top: -10;}.
Geht soweit auch, nur wenn ich das Fenster in der Höhe ändere, bleibt das Div nicht an seiner relativen Position zur Zelle, sondern zum Fenster rand, und springt erst wieder an die richtige Position, wenn ich in meinem Dokument über ein Mouseover Ereignis gehe.
Änder ich jetzt die Positionierung auf absolute, orientiert sich das Div immer zum Fensterrand.
Die Datei hat keine Doctypeangabe, füge ich jetzt strict ein, funktioniert die Positionierung auch bei Größenänderung des Fensters, aber ich kann die Haupttabelle nicht mehr in der Höhe zentrieren. Als Lösung hatte ich mir zum Beispiel überlegt, eine Tabelle übers ganze Fenster zu erstellen, in einer Tabelle ist es für mich kein Problem die Zentrierung zu erreichen.
Man kann aber eine Zelle bei strict nicht mit height=100% definieren.
Kann mir jemand auf eine dieser drei Fragen eine Antwort geben:
1. Wie löse ich ohne Doctype das Positionierungsproblem?
2. Wie kann man bei Doctype strict eine Tabelle zentriert im Fenster erstellen?
3. Wie kann man bei Doctype strict eine Tabelle über die gesamte Fenstergröße erstellen?
Ganz vielen Dank für eure Hilfe
guelcki
Hallo Guelcki,
und in der css Datei: #zelle {position: relative; top: -10;}.
Bei dem top-Wert fehlt die Größenangabe (also z.B. "px"). Wenn das trotzdem nicht funktioniert, versuch's mal mit {margin-top:-10px} oder {padding-top:-10px}. Sind aber alles nicht wirklich "stabile" Angaben, die wahrscheinlich nicht immer und überall funktionieren.
Alternativ könntest du es auch so machen: Du hast die Tabellenzelle ja in der Seite vertikal zentriert. Wenn du diese Tabellenzelle also 20 Pixel größer machst, indem du unten weißen (unsichtbaren) Rand hinzufügst, schiebt sich der obere Rand der Tabellenzelle logischerweise um 10 Pixel nach oben:
+----------------------------------------------------+
| (Webseite) |
| |
| +---(10px höher als erwartet)--+ |
| | | |
| | | |
| | | |
| | | |
| | Tabellenzelle | |
| | | |
| | | |
| | | |
| +------------------------------+ |
| | (20px unsichtbarer Rand) | |
| +------------------------------+ |
| |
| |
+----------------------------------------------------+
Viel Erfolg,
Robert
Hallo,
- Wie löse ich ohne Doctype das Positionierungsproblem?
Dein Problem habe ich, ehrlich gesagt, nicht verstanden.
- Wie kann man bei Doctype strict eine Tabelle zentriert im Fenster erstellen?
so:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html style="height:100%;">
<head>
<title>Tabelle in der Mitte</title>
</head>
<body style="height:100%;">
<table style="width:100%; height:100%;">
<tr>
<td style="text-align:center;">
<table border="1" style="margin:auto;">
<tr>
<td>Zellinhalt</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
- Wie kann man bei Doctype strict eine Tabelle über die gesamte Fenstergröße erstellen?
siehe die äußere Tabelle oben
Gruß
Axel