Top-Themen

AppleEntwicklungHardwareInternetLinuxMicrosoftMultimediaNetzwerkeOff TopicSicherheitSonstige SystemeVirtualisierungWeiterbildungZusammenarbeit

Aktuelle Themen

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit
GELÖST

Div Bereich vertikal Zentrieren

Frage Entwicklung CSS

Mitglied: v3rtico

v3rtico (Level 1) - Jetzt verbinden

10.11.2008, aktualisiert 14.11.2008, 6392 Aufrufe, 9 Kommentare

Ich arbeite derzeit an einer Seite, für welche ich einen Div Bereich auf einer Seite zentrieren muss.

Hallo,

ich arbeite derzeit an einer Seite und habe dabei ein Problem: Der Inhalt der Seite soll zentriert werden. Der Inhalt steht in einem Div Bereich, welcher demnach sowohl horizontal als auch vertikal mittig auf der Seite stehen soll, egal bei welcher Auflösung.

Hier eine Vorschau wie es aktuell aussieht: http://www.tekstr.de/developer/helen

Und hier der Quelltext:
01.
<html> 
02.
 
03.
	<head> 
04.
		<title>Helen's Seite</title> 
05.
		<link rel="stylesheet" type="text/css" href="style/style.css"> 
06.
	</head> 
07.
	 
08.
	<body> 
09.
		<!-- Außenrand--> 
10.
		 
11.
		 
12.
		<div align="center" style="margin: 0 auto" > 
13.
		<div 
14.
			align="center" 
15.
			style=" 
16.
			padding-left:50px; 
17.
			padding-right:170px; 
18.
			width:730px; 
19.
			height: 580px; 
20.
			border:1px solid black; 
21.
			margin: auto;"> 
22.
		 
23.
		<!-- Innenrand--> 
24.
				<div style=" 
25.
					width:639px; 
26.
					height: 364px; 
27.
					border:1px solid black; 
28.
					margin-top: 145px; 
29.
					padding-left: 50px; 
30.
					padding-right: 50px; 
31.
					padding-top: 20px; 
32.
					padding-bottom: 20px"> 
33.
				Innenrand 
34.
				</div> 
35.
		 
36.
			Dies ist die äußere Box 
37.
 
38.
		</div> 
39.
		</div> 
40.
	</body> 
41.
 
42.
</html>
Die oben im Quelltext erwähnte CSS Datei ist zur Zeit noch leer. Also wie kann ich den Div Bereich (Außenrand) vertikal zentrieren? Irgendeine Idee?

Vielen Dank schonmal

Grüße
Max aka v3rtico
Mitglied: bytecounter
10.11.2008 um 11:07 Uhr
Hallo,

ich würde das wie folgt machen (ungetestet!):

01.
... 
02.
  margin-top:50%; 
03.
  margin-bottom:50%; 
04.
  padding-top:-290px; 
05.
...
Du setzt den Nullpunkt in die Mitte und verschiebst dann den DIV um die Hälfte der DIV-Höhe nach oben. Setzt natürlich voraus, dass Du eine fixe Höhe hast.

vg
Bytecounter
Bitte warten ..
Mitglied: rittzrattz
10.11.2008 um 11:36 Uhr
Hi,

ich habe das auf einer Intranetseite so gelöst, indem ich eine Seite mit Frames gebaut habe, die die Seite mit dem Inhalt umschließen.

Frames sind zwar nicht mehr so ganz Zeitgemäß, aber es funktioniert.

Gruß
rittzrattz
Bitte warten ..
Mitglied: v3rtico
10.11.2008 um 11:45 Uhr
Das funktioniert leider nicht. Framesets möchte ich eher nicht verwenden.
Bitte warten ..
Mitglied: ITLocke
10.11.2008 um 12:59 Uhr
Hallo evtl hilft dir dieser Link:

http://www.css4you.de/

Gruß

Locke
Bitte warten ..
Mitglied: Mitchell
11.11.2008 um 07:01 Uhr
Hi Max,

wenn du bei jeder Auflösung eine Zentrierung erwirken willst, darfst du nicht mit Pixeln arbeiten. Da es relative Größen sind, nimm em:

01.
<!-- Innenrand--> 
02.
 
03.
 <div style="margin:5em 5em 5em 5em; width:639px; height: 364px; border:1px solid black;"> 
04.
 
05.
     Innenrand 
06.
 </div>
Mfg

Mitchell

PS: Der Link oben funktioniert nicht mehr, die Datei ist nicht mehr da.
Bitte warten ..
Mitglied: ITLocke
11.11.2008 um 07:37 Uhr
Zitat von Mitchell:

PS: Der Link oben funktioniert nicht mehr, die Datei ist nicht mehr
da.

Hmm bei mir funktioniert er wunderbar...
Bitte warten ..
Mitglied: v3rtico
11.11.2008 um 08:14 Uhr
Stimmt ich habe den Ordner umbenannt, die neue Datei liegt in www.tekstr,de/developer/helen das hatte ich vergessen.
Bitte warten ..
Mitglied: Mitchell
11.11.2008 um 09:29 Uhr
ich habe dann mal den Link oben für alle geändert, damit man direkt drauf zugreifen kann

Mfg

Mitchell

PS: Sieht gut aus die Seite ^^
Bitte warten ..
Mitglied: Mitchell
14.11.2008 um 07:13 Uhr
wie siehts hier aus, schon Neuigkeiten?

Mfg

Mitchell
Bitte warten ..
Ähnliche Inhalte
Administrator.de Feedback
Neuer Bereich Powershell und erweitertes syntax highlighting (6)

Frage von Kraemer zum Thema Administrator.de Feedback ...

Router & Routing
Ansprechpartner: Public IP-Bereich mieten oder kaufen (13)

Frage von certifiedit.net zum Thema Router & Routing ...

VB for Applications
gelöst Ausgewählten Bereich eines Excel Dokumentes per email verschicken (7)

Frage von Edd1ng zum Thema VB for Applications ...

Neue Wissensbeiträge
Peripheriegeräte

Was beachten bei der Wahl einer USV Anlage im Serverschrank

(5)

Tipp von zetboxit zum Thema Peripheriegeräte ...

Windows 10

Das Windows 10 Creators Update ist auf dem Weg

(5)

Anleitung von BassFishFox zum Thema Windows 10 ...

Administrator.de Feedback

Tipp: Ungelöste Fragen ohne Antwort in Tickeransicht farblich hinterlegen

Tipp von pattern zum Thema Administrator.de Feedback ...

Viren und Trojaner

Neue Magazin Ausgabe: Malware und Angriffe abwehren

Information von Frank zum Thema Viren und Trojaner ...

Heiß diskutierte Inhalte
Windows Systemdateien
Warum System auf "C:" (29)

Frage von DzumoPRO zum Thema Windows Systemdateien ...

LAN, WAN, Wireless
Cisco SG200: Auf bestimmtem vLAN bestimmte TCP-Ports sperren (19)

Frage von SarekHL zum Thema LAN, WAN, Wireless ...

Windows Server
gelöst Update BackupExec 2015 auf 2016 führt zu SQL-Server Problem (16)

Frage von montylein1981 zum Thema Windows Server ...

Batch & Shell
gelöst Batch um Benutzer aus Sitzung abzumelden (15)

Frage von zeroblue2005 zum Thema Batch & Shell ...