| Autor |
Nachricht |
Njelo
Threadersteller
Dabei seit: 18.07.2003
Ort: Leonberg
Alter: 28
Geschlecht: 
|
Verfasst Do 09.10.2008 10: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
|
|
| |
  |
 |
stardiver
Dabei seit: 28.07.2008
Ort: Oldenburg/Nds.
Alter: 41
Geschlecht:
|
Verfasst Do 09.10.2008 16: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> |
|
|
| |
|
|
sahnemuh
Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 27
Geschlecht:
|
Verfasst Do 09.10.2008 16: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: 28
Geschlecht:
|
Verfasst Do 09.10.2008 16: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 |
[css] divs nebeneinander zentrieren
Divs auf Seite fest zentrieren
[dreamweaver] zentrieren
inhalt zentrieren...
Site zentrieren
[Illustrator] Zentrieren?
|
|
Willkommen auf dem Portal für Mediengestalter
