Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 04.02.2010, 14:30
Boof Boof ist offline
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 26.07.2007
Beiträge: 67
Boof befindet sich auf einem aufstrebenden Ast
Standard CSS-Seite horizontal und vertikal zentrieren!

Hallo zusammen!

Ich versuche mich gerade an einer neuen Website, die ich zum ersten Mal in XHTML und CSS erstellen möchte. Die letzte Version hatte HTML und ein paar kleine CSS-Scripte. Ich würde die Seite gerne horizontal und vertikal zentrieren und habe dazu fongenden Script:

XHTML-Datei:
HTML-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>

<title>CSS-Test - Mitte zentriert</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="harpo.css"/>

</head>
<body>
    <div id="bigbox">
      <div id="innenbox">
      </div>
    </div>
  </body>
</html>
ausgelagerter CSS-Script:
Code:
body {
  background-image: url(blank.jpg);
  padding:0px;
  margin:0px;
}
#bigbox { 	
  position:absolute;
  height:595px; 
  width:992px;
  margin:-296px 0px 0px -496px;
  top: 50%; 
  left: 50%;

  padding: 0px;
  background-image: url(back.jpg);
}
#innenbox { 	
	position:absolute;
	color: #0000FF;
	top: 26px;
	left: 46px;
}
Da ich in XHTML und CSS nur leichte Grundkenntnisse habe,
habe ich zwei Fragen dazu:

1.) Testlink: CSS-Test - Mitte zentriert. Ich hätte gerne, dass sie Website (wie im Script angegeben) in einer Größe von 992 px x 595 px horizontal und vertikal immer zentriert angezeigt wird. Ist der von mir angegebene Script so OK? Bzw, kann man darauf auch weiter aufbauen. Für mich ist wichtig, dass die Website auch in den gängigsten Browsern IE, Mozilla Firefox, Opera, Safari (PC), Google Chrome auch richtig angezeigt wird.

2.) In dem (unter Frage 1) angegebenen Testlink, habe ich zur besseren Veranschaulichung in der Mitte einfach mal eine Testgrafik eingefügt. Was den Außenrahmen betrifft, der hier eine schwarze Pixelgrafik mit Namen blank.jpg besitz, so würde ich diesen Bereich auch gerne ein wenig Gestalten, so dass oben, rechts, unten und links (anstatt der Pixelgrafik) jeweiles eine einzelne Grafik liegt. Der jeweilige Außenbereich (der ja logischer Weise variable sein muss) soll sich bei kleineren Bildschirmauflösungen außen zusammenschieben und nicht zwischen dem mittleren Inhaltsbereich (wo momentan die Testgrafik liegt). Ich weis nur nicht, wie ich meinen Script dafür umbauen muss. Kann mir da einer helfen, oder einen Tipp geben? Wäre echt nett!

Herzliche Grüße
Boof
Mit Zitat antworten
Sponsored Links