Autor |
Nachricht |
Njelo
Threadersteller
Dabei seit: 18.07.2003
Ort: Leonberg
Alter: 43
Geschlecht:
|
Verfasst Do 09.10.2008 11:46
Titel Mehrere floatende DIVs zentrieren... |
|
|
Hallo!
Google- und Forumssuche haben leider nicht genau das ergeben, wonach ich suche... Ich möchte drei nebeneinander floatende DIVs als Gruppe horizontal zentrieren. Dabei kann/möchte ich sie nicht in einen "wrapper" mit fester Breite und "margin: 0 auto" stecken, da sich die DIVs dann nicht mehr untereinander schieben, wenn man das Browserfenster verkleinert. Zur Veranschaulichung:
Ansätze habe ich einige gefunden:
http://www.brunildo.org/
http://pmob.co.uk/
http://cssbeauty.com/
...jedoch alle mit Einschränkungen (JS verwendet, nicht cross-browser-kompatibel, nicht durchgängig zentriert auf mehren Zeilen, etc) – gibt es eine elegante (HTML/CSS) Lösung?
Vielen Dank schon mal!
Grüße
Njelo
|
|
|
|
|
Benutzer 80255
Account gelöscht
Ort: -
|
Verfasst Do 09.10.2008 17:06
Titel
|
|
|
Hallo,
ich hab mal n bischen getüftelt und diese Lösung gefunden. Hierbei springt der div C allerdings erstmal unter div A.
Naja, vielleicht hilfts:
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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<style>
html {height:100%;}
body {
height:100%;
margin:0%;
padding:0%;
}
div { width: 200px; height:400px; border:1px solid black; float:left;}
#spacer {width:50%; height:95%; position:relative; margin-left:-300px; border:1px solid red;}
</style>
</head>
<body>
<div id="spacer"> </div>
<div> 1</div>
<div> 2</div>
<div> 3</div>
</body>
</html> |
|
|
|
|
|
Anzeige
|
|
|
sahnemuh
Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht:
|
Verfasst Do 09.10.2008 17:14
Titel
|
|
|
gib dem wrapper doch einfach 'ne prozentuale breite.
also z.b: width: 70%; margin: 0 auto;
|
|
|
|
|
Njelo
Threadersteller
Dabei seit: 18.07.2003
Ort: Leonberg
Alter: 43
Geschlecht:
|
Verfasst Do 09.10.2008 17:34
Titel
|
|
|
@stardiver&sahnemuh
Danke - beide Lösungen sorgen dafür, dass der DIV, der in die neue Zeile springt, sich links ausrichtet ( wie schon erwähnt unter A)...
Entgegen meiner Skizze suche ich aber eine Lösung, bei der sich die DIVs jeweils mittig in der neuen Zeile ausrichten...
Habe es mit horizontalen Listen versucht, da kann ich den einzelnen <li>-Elementen aber keine feste Breite zuordnen und die bräuchte ich, sonst laufen die auf die ganze Breite...
|
|
|
|
|
|
|
|
Ähnliche Themen |
DIVs zentrieren
2 Divs auf Seite zentrieren
[css] divs nebeneinander zentrieren
Zentrieren von floating DIVs
3 DIVs im übergeordnetem DIV zentrieren & fixieren? HELP!
Divs auf Seite fest zentrieren
|
|