• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

div horizontal und vertikal zentrieren

Status
Für weitere Antworten geschlossen.
georgew

georgew

Neues Mitglied
hallo,
ich will einen div horizontal und vertikal zentrieren und habe das mit

Code: 
#kasten{height: 600px; width: 800px; 
margin-top:-300px; margin-left:-400px; 
top:50%; left:50%; position:absolute;}

probiert... allerdings, wenn man das fentser verkleinert so dass der kasten nicht mehr ganz draufgeht, dann wird oben und links der kasten abgeschnitten (siehe http://georgew.famthoma.de , bei kleineren fentser als 800x600px)

ich hätte es gerne so wie auf http://leibniz.de, dass aucj bei verkleinertem fenster man durch scrollen in allen richtungen den gesamten kasten sehen kann... aber auf leibniz.de ist auch das gleiche zentrierungsprenzip wie bei mir oben angewand...

kann jemand mir helfen?

vielen dank,
Georg
 
Werbung:
die seite, von leibnitz ist glaub ich auf height:100% und dann mit margin abgeschnitten worden. Bei deinem Prob hat hier feyyaz mal nen tipp geschrieben, wie das geht.
Such mal per Boardsuche nach autor feyyaz im css bereich
 
Also ich werde kein Kunde von Bahlsen, denn ich sehe auf deren Seite nur:
Für diesen Inhalt ist der Macromedia Flash Player erforderlich. Sei können den Player kostenlos laden und installieren: Flash installieren
Zum Vergrößern anklicken....
Ohne Flash und JavaScript sieht man garnichts. :evil:

Zu testzwecke mal JavaScript und Flash aktiviert und folgende Formatierung im Quelltext entdeckt:
Code: 
if(hasRightVersion) {  // sofern eine akzeptable Version ermittelt wurde
var oeTags = '<table width="90%" height="90%" border="0" align="center">'
   + '<tr><td style="border:0px;"><div align="center">'
   + '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"'
   + 'width="700" height="500"'
Bei mir ist es so (Auflösung:1024x768), dass die Box mit dem Flash im obern Teil der Seite ist. Also keine vertikale Zentrierung statt findet. :roll:

Davon mal abgesehen geht deine Seite georgew bei mir eh über die gesamte Höhe, also wäre ein vertikales Zentrieren bei der Größe, frühestens ab einer Auflösung von 1280x1024 interessant.

Zur Lösung:
Bei Divs gibt es immer Probleme mit der vertikalen Ausrichtung, deshalb sehe ich hier erstmal nur die Möglichkeit mit einer Tabelle zu arbeiten. Dazu habe ich folgende Testseite geschrieben:
Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
<html>

	<head>
		<title>Test</title>
		<style type="text/css">
			#cont {
				width:100%;
				height:100%;
				text-align:center;
				vertical-align:middle;
			}
			#inhalt {
				width:800px;
				height:400px;
				margin:auto;
				border:solid 1px #000;
				Text-align:left;
			}
		</style>
	</head>
	<body>

	<table id="cont"><tr><td>
	<div id="inhalt">
		<h1>&Uuml;berschrift</h1>
		

Ein kurzer Mustertext umd den Inhalt zu testen.
		Ein kurzer Mustertext umd den Inhalt zu testen.
		Ein kurzer Mustertext umd den Inhalt zu testen.
		Ein kurzer Mustertext umd den Inhalt zu testen.
		Ein kurzer Mustertext umd den Inhalt zu testen.
		Ein kurzer Mustertext umd den Inhalt zu testen.
		Ein kurzer Mustertext umd den Inhalt zu testen.</p>
	</td></tr></table>
	</div>

	</body>
</html>
Ich hab die Höhe extra kleiner gewählt damit ich die Auflösung nicht umstellen muss. :lol:
Bei mir funktioniert es so wie du es haben wolltest. Auch wenn das mit der Tabelle eine Art Hilfskrücke ist. ;)

Gruß
Hobbyuser

PS: Ich sehe da noch einige andere Mängel auf deiner Seite.
 
Werbung:
weißt du denn noch wie er das problem gelöst hat (falls du damals die seite gelesen hast), Prophet? ist feyyaz noch aktiv o dass man ihm ne PN schicken kann?
 
ne eben nicht... das ist ja das problem und aktiv ist er glaube ich nicht mehr... er war einer der alten Admins...
 
Werbung:
nein, er war nur Mod. Aber wenn du ihm ne PN schreibst, wird er die sicher lesen...
Er hat meine egtl immer gelesen, auch wenn das schon bisi länger her ist :p
 
@hobbyuser: deine lösung funktioniert komischer weiße nur mit html und nicht mit xhtml...

@crackpod: ich probiers mal mit ner PN
 
Werbung:
Hallo Ben

das Problem auf der Seite ist das gleich wie bei georgew. Es werden negative margin-Werte eingesetzt und beim scrollen verschwinden einige Inhalte ins Nirvana. Darum wollte er einen anderen Lösungsweg.

@georgew
Warum das unter XHTML nicht funktioniert kann ich so nicht sagen vielleicht teste ich das aber mal am Wochenende. :D
Bei einer weiteren Suche in Google hab ich noch eine Lösung gefunden wo man dem Body eine Lineheight von 100% gibt, dann kann man angeblich auch mit "vertical-align" arbeiten. Leider habe ich den Link nicht gespeichert, aber du kannst ja selber noch mal suchen. :p

Gruß
Hobbyuser
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben