|
|||
Komplette Seite zentrieren (ohne "text-align" und Tabellen)?
Hallo, ich stehe gerade vor einem Problem...
Ich möchte, dass der gesamte Inhalt meiner Seite immer zentriert ist, egal welche Auflösung eingestellt ist oder welche Größe das Browserfenster hat. Jetzt gibt es da ja das schöne "text-align". Wenn ich über mein CSS einem div-Block ("container"), der alles umschließt, die Eigenschaft "text-align:center" zuweise, dann funktioniert es zwar, allerdings ist es ja nicht erlaubt, diese Eigenschaft auf Blockelemente anzuwenden. Und <div> ist ja definitiv ein Blockelement. Zitat:
Code:
#container { position:absolute; left:50%; width:775px; margin:0 0 0 -388px; padding:0; } |
Sponsored Links |
|
|||
Die Suche liefert dir hunderte Ergebnisse...
Nimm ein div, gib es mit CSS folgende Werte: text-align: left; width: 775px; margin: 0 auto; und weise dem body-tag den Wert: text-align: center; zu, schon klappt es... Geändert von cgdesign (02.06.2006 um 14:56 Uhr) |
Sponsored Links |
|
|||
Gesucht habe ich! Allerdings bin ich eigentlich nur auf das "margin: 0 auto;" gestoßen, was bei mir ja irgendwie nicht funktionieren will (getestet bis jetzt nur im FF 1.5.0.4).
Das was du geschrieben hast, kommt mir noch etwas aufgebläht vor und unterscheidet sich ja auch nicht stark von dem, was ich hab. Gibt es denn keine Möglichkeit, das ganze einfacher, also vllt. mit ein oder zwei Eigenschaften zu realisieren? Bzw...woran kann das liegen, dass das "margin:0 auto;" bei mir nicht funktioniert? Vllt. hier noch mal ein paar weitere Infos: Browser: Firefox 1.5.0.4 Code:
Auszug aus meinem CSS: body,textarea { background-color:#99cc00; font-family:Verdana,Arial,sans-serif; color:#000000; font-size:12pt; } #container { position:absolute; left:50%; width:775px; margin:0 0 0 -388px; padding:0; /* margin: 0 auto;*/ } Code:
Auszug aus meiner html: <?xml version="1.1" encoding="ISO-8859-1"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>[(site_name)] | [*pagetitle*]</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/> <link rel="stylesheet" href="[(base_url)]A_M/templates/screen.css" type="text/css" media="screen"/> <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="[(site_url)][~11~]"/> <base href="[(site_url)]"/> <!--[if lte IE 6]> <style type="text/css" media="screen, tv, projection"> body { behavior: url(assets/js/csshover.htc); } /* hover:anything support */ #content { margin-left: 22px; } /* to avoid the BMH */ a, a:link { border-bottom-style: solid } /* becuase IE just doesn't dot */ </style> <script type="text/javascript" src="assets/js/sleight.js"></script> <![endif]--> <script src="manager/media/script/scriptaculous/prototype.js" type="text/javascript"></script> <script src="manager/media/script/scriptaculous/scriptaculous.js" type="text/javascript"></script> </head> <body> <div id="container"> <div id="site"> <div id="header"> <img src="[(base_url)]A_M/images/head_04_775.jpg" alt="Startseite"/> </div> <!-- close #header --> <div id="headmenu"> <!-- close #headmenu --> <div id="content"> [*#content*] </div> <!-- close #content --> <div class="clear"> </div> <div id="footer"> <p> </p> </div> <!-- close #footer --> </div> <!-- close #site --> </div> <!-- close #container --> </body> </html> |
|
|||
Hast du mein Post überhaupt zu Ende gelesen? Einfacher geht's nicht... Und was du für Fehler gemacht hast, steht eigentlich auch in meinem Post, wenn du denn dein Quelltext mit meinem vergleichst...
Sooo, vielleicht poste ich mal ein Beispielcode, damit du es verstehst. 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" lang="de"> <head> <title>neu</title> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> <style type="text/css"> body { background-color: #9c0; font: 0.8em verdana; text-align: center; } #container { background: #fff; width: 775px; margin: 0 auto; text-align: left; } </style> </head> <body> <div id="container">text</div> </body> </html> Geändert von cgdesign (02.06.2006 um 15:04 Uhr) |
|
|||
Ich habe es doch verstanden. Ich hatte nur gedacht/gehofft, dass es auch kürzer geht. Das es so funktioniert ist schon klar.
Ich hab das jetzt erstmal in meinen Code eingebaut. Jetzt muss ich nur noch die Stelle suchen, die meinen Text auch ohne das "text-align:left" linksbündig macht. edit: Hmm...den Grund hab ich gefunden (Tippfehler; dadurch wurde das "text-align:center" nicht übernommen). Allerdings verstehe ich jetzt nicht so ganz, wozu das "text-align:center" für den body gut sein soll. Kann mir das bitte einer erklären? Zentriert ist es auch ohne diese Angabe. Geändert von marcee (02.06.2006 um 14:52 Uhr) |
|
||||
Zitat:
Zitat:
__________________
Die Zeit hat ihre Kinder längst gefressen: hund (back in black) | ??? | ??? | ... |
|
|||
Zitat:
|
|
|||
Erstmal danke an euch!
Zitat:
Zitat:
Na gut...dann wäre das Problem ja gelöst. Danke nochmal an euch! |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Div-Konainer soll sich über komplette Seite legen | Safran | CSS | 3 | 02.07.2006 19:14 |
Seite zentrieren.... | Spyker | CSS | 2 | 16.01.2006 23:21 |
Fröhliches Rätselraten - Firefox zeigt komplette Seite nicht | Boris | CSS | 4 | 02.06.2005 17:49 |
Style Sheets => eine Seite zwei verschiedne Tabellen | PowerBook | CSS | 2 | 23.10.2004 13:10 |
Wie am besten alte HTML Seite mit Tabellen in CSS Layout ? | Fidi | CSS | 0 | 07.01.2004 12:27 |