• Das kreative Thema des Monats Oktober wird vor allem diejenigen unter Euch besonders ansprechen, denen Do-it-yourself quasi im Blut liegt. Zeigt uns Eure Improvisationskünste oder fotografiert, was andere Leute sich so im Alltag zusammengestrickt haben. --> Zum Mitmachen bitte hier klicken

div mit Tabelle zentrieren?

macharry

Tokyo Rose
Registriert
12.04.06
Beiträge
67
ich möchte gern eine Tabelle, die den Content-Bereich einer Homepage darstellt, zentriert haben. Oben und rechts davon möchte ich per div Banner positionieren können. Bislang ist mir das Vorhaben nur linksbündig gelungen:

<div id="hauptbereich" style=" width:915px; height:0px; left:0px; position:absolute; top:110px;">
<table><tr><td bgcolor="black" width="915" height="600">Content</td></tr></table>
</div>
<div id="superbanner" style=" width:728px; height:90px; position:absolute; top:10px; left:197px;">
<table bgcolor="black" width="728" height="90" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="superbanner.jpg" alt="" border="0"></td>
</tr>
</table>
</div>
<div id="skyscraper" style="width:160px; height:600px; position:absolute; left:925px; top:10px;">
<table bgcolor="black" width="160" height="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="skyscraper.jpg" alt="" border="0"></td>
</tr>
</table>
</div>

Kann man so eine Konstruktion mit der Änderung von einigen Angaben zentrieren?
 
hmmm ich bin mir jetzt grad nicht ganz sicher ob ich dich richtig verstanden habe...
Aber wenn du die Tabelle im div zentrieren möchtests heisst das Losungswort im CSS "text-align: center;"...
Falls du den gesamten div zentrieren möchtest sollte das ebenfalls mit CSS "margin: 0 auto;" funktionieren (Achtung, vorher Breitenangabe des divs definieren!)...

Grüsse
 
Wenn Du eine schnelle Lösung suchst würde ich es so versuchen:
Code:
<div id="hauptbereich" style=" width:915px; height:0px; left:50%; margin-left: -457px; position:absolute; top:110px;">
<table><tr><td bgcolor="black" width="915" height="600">Content</td></tr></table>
</div>
<div id="superbanner" style=" width:728px; height:90px; position:absolute; top:10px; left:50%; margin-left:-261px;">
<img src="superbanner.jpg" alt="" border="0">
</div>
<div id="skyscraper" style="width:160px; height:600px; position:absolute; left:50%; margin-left: 467px; top:10px;">
<td><img src="skyscraper.jpg" alt="" border="0">
</div>

ABER: Dafür sind Tabellen nicht gedacht! Tabellen werden nur für die Darstellung von tabellarischem Inhalt benutzt.
Nutze am Besten die dafür gedachten Tags (z.b. <p></p>)
Torben
 
Danke, sieht super aus! Die Seite, um die es geht, wurde vor zehn Jahren in Form einer Tabelle programmiert. Da lässt sich so schnell nichts ändern. Aber so lassen sich die Banner jetzt flexibel außen positionieren.
 
Bei Tabellen läufts mir kalt den Rücken runter :D
 
Eine Frage ist doch noch aufgekommen: Wenn ich die Seite auf z.B. 400 Pixel Breite zusammenschiebe, dann verschwindet der linke Teil der Tabelle, wo in dem Fall die Navigation untergebracht ist. Bei der rechten Seite ist das anders. Da kann man bei einem stark zusammengeschobenen Fenster per Scrollbalken immer bis zum Rand rüberscrollen. Kann man das für die linke Seite auch hinbekommen?
 
War meine Nachfrage unverständlich? Wenn man das Fenster mit der Website in der Breite so verkleinert, dass nicht mehr alles zu sehen ist, dann ist die Seite rechtsbündig und linke Teil lässt sich auch mit Scrollen nicht mehr ansehen. Kann man das mit ein paar Änderungen vielleicht seitenverkehrt machen, dass die Seite beim Zusammenschieben des Fensters linksbündig wird?