mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 26.04.2024 00:57 Benutzername: Passwort: Auto-Login

Thema: container horizontal und vertikal ausrichten. vom 23.12.2004


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> container horizontal und vertikal ausrichten.
Autor Nachricht
Raumwurm
Threadersteller

Dabei seit: 21.12.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Do 23.12.2004 12:55
Titel

container horizontal und vertikal ausrichten.

Antworten mit Zitat Zum Seitenanfang

Hi. Kennt jemand ein andere Möglichkeit einen Container (mit fixer
Breite und Höhe) horizontal und vertikal auszurichten und zwar ohne
die Hilfstabelle außenrum (und ohne javascript) - like this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
font-family: Arial, Helvetica, sans-serif;
font-size: .7em;
color: #000000;
text-align:center;
margin:0;
padding:0;
}
#maintable {
width:100%;
height:100%;
text-align: center;
vertical-align: middle;
}
#container {
background-color: red;
height: 450;
width: 750;
margin: 0 auto;
}
-->
</style>
</head>
<body>
<table id="maintable">
<tr>
<td><div id="container"></div></td>
</tr>
</table>
</body>
</html>
  View user's profile Private Nachricht senden
calvin

Dabei seit: 30.11.2004
Ort: Frankfurt am Main
Alter: -
Geschlecht: Männlich
Verfasst Do 23.12.2004 13:39
Titel

Antworten mit Zitat Zum Seitenanfang

hmm ...
vielleicht mit nachdenken *ha ha*
...
vielleicht mit der suche *zwinker*
oder vielleicht mit google *zwinker*
...

aber es ist ja weihnachten *ha ha*

spontan fallen mir da drei möglickeiten ein:

margin-left:auto; margin- right:auto; [auto ist aber so 'ne sache - würd ich nicht machen]

positioniere es links, und oben jeweils mit 50% und gib dem div dann jeweils oben und links einen negativen margin mit jeweils der hälfte der height/width

oder du gibts dem div jeweils 50% height/width, 25% top/left
  View user's profile Private Nachricht senden
Anzeige
Anzeige
l'Audiophile

Dabei seit: 16.09.2004
Ort: Berlin
Alter: 43
Geschlecht: Männlich
Verfasst Do 23.12.2004 13:50
Titel

Antworten mit Zitat Zum Seitenanfang

calvin hat geschrieben:

positioniere es links, und oben jeweils mit 50% und gib dem div dann jeweils oben und links einen negativen margin mit jeweils der hälfte der height/width


Nimm diese Variante; die funktioniert fast überall!

Beispiel für einen Container mit 800 x 600px

Code:

#container {
    position:absolute;
    left:50%;
    top:50%;
    width: 800px;
    height: 600px;
    margin-left:-400px;
    margin-top:-300px;
}
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
sahnemuh

Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht: Männlich
Verfasst Do 23.12.2004 13:55
Titel

Antworten mit Zitat Zum Seitenanfang

pejot hat geschrieben:
calvin hat geschrieben:

positioniere es links, und oben jeweils mit 50% und gib dem div dann jeweils oben und links einen negativen margin mit jeweils der hälfte der height/width


Nimm diese Variante; die funktioniert fast überall!

Beispiel für einen Container mit 800 x 600px

Code:

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

*Thumbs up!*

zur veranschaulichung / mit abwandlung:
http://www.wpdfd.com/editorial/thebox/deadcentre4.html


Zuletzt bearbeitet von sahnemuh am Do 23.12.2004 13:56, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Raumwurm
Threadersteller

Dabei seit: 21.12.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Do 23.12.2004 13:57
Titel

Antworten mit Zitat Zum Seitenanfang

wunderbar - da bleiben keine wünsche offen. grazie.
  View user's profile Private Nachricht senden
 
Ähnliche Themen Dreamweaver - Horizontal und vertikal ausrichten
[css] Layer horizontal und vertikal mittig ausrichten
CSS Container 100% Vertikal ausrichten
CSS Container vertikal unten bündig ausrichten
CSS: Container im Container Vertikal zentrieren
[CSS] Zentrieren vertikal und horizontal
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.