Moin, ich hab folgendes problem:
meine haupt-div box wird nicht da angezeigt, wo ich sie haben will…
so soll es ungefähr aussehen:
http://home.arcor.de/metal_manni/Unbenannt1.jpg
so sieht es aus:
http://home.arcor.de/metal_manni/Unbenannt2.jpg
danke für eure hilfe…
Manni
Der Quellcode wäre interessanter?! :roll:
<html>
<head>
<title>Black Sheep Unna</title>
</head>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="menuscript.js" language="javascript" type="text/javascript"></script>
<body>
<div id="seite">
<div id="banner">
<a href="start.html" target="home"><img src="banner.jpg" border="0"></a>
</div>
<div id="navi">
NAVIGATION
</div>
<div id="navi_oben">
<a href="impressum.html" target="home">Impressum</a>
</div>
<div id="iframe">
<iframe src="start.html" width="100%" height="100%" frameborder="0" name="home"></iframe>
</div>
<div id="copy">
© 2008 by Black Sheep
</div>
</div>
</body>
</html>die box mit der id seite ist die angesprochene box…
css für die box sieht so aus:
#seite{
margin: auto;
width:1000px;
height: 570px;
border:0px solid red;
background:#000000;
color:#00CC00;
}
hab es schon mit valign:middle versucht, aber das klappt nicht…
valign:middle gibt es nicht. Es heißt wenn schon „vertical-align: middle;“. Abgesehen davon fehlt in deinem Quellcode ein Doctype.
SELFHTML: HTML/XHTML / Allgemeine Regeln für HTML / Grundgerüst einer HTML-Datei
Und zur vertikalen Ausrichtung ohne Tabellen gibt es sehr viele interessante Artikel im Netz. Beispiele:
Vertikal und horizontal zentrieren ohne Tabelle
Webstandards-Projekt - Vertikal Zentrieren
Zentrieren
Am einfachsten finde ich ein winziges
#zentrierhilfe {
position: absolute;
top: 50%;
left:50%;
height: 1px;
width: 1px;
}
In dieses
#seite{
position: absolute;
top: -285px; /* hälfte von height */
left: -300px;/* hälfte von width */
width:600px;
height: 570px;
background:#000000;
color:#00CC00;
}
Das war es eigentlich schon.
Diese simple Methode funktioniert natürlich nur solange width und height feste Werte haben.
Ohne wird es komplizierter.
Width habe ich stark verkleinert weil bestimmt viele Forenteilnehmer nicht die nötige Auflösung eingestellt haben um sich ein über 1000px breites Browserfenster anzeigen zu lassen. Ich (und sicher auch Andere) müssten die Bildschirmauflösung ändern um den Effekt zu sehen.
Warum willst du eigentlich keinen Doctype angeben?
das mit dem doctype hab ich einfach vergessen 
werd ich noch ändern
danke neuroleptika für deinen tipp, es klappt 
Dafür zwei divs zu nehmen ist aber überflüssig. Das geht auch mit einem.
Indem das nämlich wie in Deinem Beispiel zuerst bei 50% top positioniert und dann mit margin-top:-(height/2) nach oben verschoben wird.
Die horizontale Zentrierung mit der Methode würde ich dringend unterlassen(!), denn die führt zur Nichtbenutzbarkeit der Site, wenn das Browserfenster kleiner ist, als das darzustellende Element. Denn dann geht der Inhalt links aus dem Browser raus, und Scrollbalken die nach links scrollen können, gibt es nicht!
Um ein Block-Element mit fixer Breite horizontal zu zentrieren, verwendet man „margin:0 auto;“, das funktioniert in jedem Browser im Standards Mode. Bevor ich die von Dir gezeigte horizontale Zentrierung benutzen würde, würde ich lieber auf die Zentrierung verzichten!
Width habe ich stark verkleinert weil bestimmt viele Forenteilnehmer nicht die nötige Auflösung eingestellt haben um sich ein über 1000px breites Browserfenster anzeigen zu lassen. Ich (und sicher auch Andere) müssten die Bildschirmauflösung ändern um den Effekt zu sehen.
Die Bildschirmauflösung begrenzt nur die maximal verfügbare Anzeigefläche nach oben. Sonst hat die Auflösung keine Relevanz. Auch mit einer Auflösung von 1280x1024 kann man ein Fenster haben, das kleiner ist als 1000px.
Gruß,
-Efchen
Nabend Efchen,
Da muss ich dir recht geben. Eine Verschiebung, links aus dem Viewpoint lässt sich mit dieser Methode nicht Verhindern.
Gerade bei größeren Elementen ist es wohl wirklich nicht zu empfehlen.
Für eine Kleine online-Visitenkarte mit wenig Inhalt kann man sowas aber machen.
margin: auto; funktioniert im IE5 nicht.
Die Bildschirmauflösung begrenzt nur die maximal verfügbare Anzeigefläche nach oben. Sonst hat die Auflösung keine Relevanz. Auch mit einer Auflösung von 1280x1024 kann man ein Fenster haben, das kleiner ist als 1000px.
Meine maximale verfügbare Anzeigefläche reicht nicht um so riesige Fenster darzustellen. Ich muß meine Lieblingsauflösung ändern um den Zentriereffekt zu sehen. Den Wert für height zu ändern habe ich einfach nur vergessen.
Aber wenn jemand mit nem kleinen Handy-Bildschirm kommt, kann das trotzdem wieder zu Problemen führen. Ich würde es grundsätzlich nicht empfehlen, weil es ja auch keinen Grund dafür gibt. Es gibt ja eine andere Möglichkeit, ein Element horizontal zu zentrieren. Es gibt aber nur sehr wenige Browser, die das nicht verstehen und wenn da die Website nicht zentriert ist, ist das weniger tragisch, als wenn es auch nur einen gibt, der die Site aufgrund der Verschiebung nicht nutzen kann.
Gruß,
-Efchen