Übergroße Elemente mit float-Navigation
Jens Müller
- css
Guten Abend!
Ich habe auf meiner Homepage einen Navigationsbereich, welcher mit float:left positioniert ist. Das Ganze sieht dann ungefähr so aus:
+--------------------------------------------------------+
| |
| +---------------------------------------------+ |
| | | |
| +------+-------+ Überschrift | |
| | - Bla | | |
| | - Bla2 | Textextextext | |
| | - Bla3 | Nochmehrtextextext | |
| | - Bla4 | Text | |
| | | Text | |
| +------+-------+ Text | |
| | Text | |
| | Und hier vorne geht der Text schönerweise | |
| | weiter... | |
| | | |
| +---------------------------------------------+ |
+--------------------------------------------------------+
Wenn ich allerdings nun dorthin, wo der Text steht, ein Bild setze, das breiter ist als das Browserfenster wird das Bild unschönerweise nach unten verschoben:
+--------------------------------------------------------+
| |
| +---------------------------------------------+ |
| | | |
| +------+-------+ Überschrift | |
| | - Bla | | |
| | - Bla2 | | |
| | - Bla3 | | |
| | - Bla4 | | |
| | | | |
| +------+-------+ | |
| | | |
| | +------------------------------------------+-+-------+
| | | [Übergroßes Bild] |
| | | |
| | +------------------------------------------+-+-------+
| | | |
| | | |
| +---------------------------------------------+ |
+--------------------------------------------------------+
Wie erreiche ich jetzt Folgendes:
Ich bedanke mich schon mal im Voraus.
Einen schönen Abend noch,
Jens
Hallo,
- Dass das Bild den Text-Kasten soweit ausdehnt, dass es nicht über seinen Rand hinausragt
Leider ist das bei CSS noch nicht vorgesehen. Der einzige der das macht ist der IE. Es währe aber gar nicht so verkehrt irgendetwas in CSS 3 dafür vorzusehen.
- Dass das Bild nicht nach unten verschoben wird, sondern direkt über der Überschrift erscheint?
Soll das Menü dann unten drunter geschoben werden?
Grüße
Jeena Paradies
Guten Abend!
- Dass das Bild den Text-Kasten soweit ausdehnt, dass es nicht über seinen Rand hinausragt
Leider ist das bei CSS noch nicht vorgesehen. Der einzige der das macht ist der IE. Es währe aber gar nicht so verkehrt irgendetwas in CSS 3 dafür vorzusehen.
Ich habe nur eines noch nicht verstanden: Was bringt dann overflow:visible? Sollte dieses das nicht eigentlich bewirken? Oder habe ich da etwas falsch verstanden?
- Dass das Bild nicht nach unten verschoben wird, sondern direkt über der Überschrift erscheint?
Soll das Menü dann unten drunter geschoben werden?
Nein, eigentlich soll das Bild dann neben das Menü gepackt werden, und dann halt dort über den rechten Rand hinausgehen (was es ja sowieso tut). Eigentlich sehe ich sowieso keinen Grund, warum das Bild weiter nach unten verschoben wird, da es ja so oder so über den Rand hinausgeht.
Gibt es wenigstens theoretisch eine Möglichkeit, das Bild mit width so zu formatieren, dass es nur bis zum Rand geht, aber dafür direkt unter der Überschrift ist? Wenn ich es mit width:100% belege, ist es immernoch unterhalb der Navigation.
Weiterhin einen schönen Abend,
Jens
Hallo,
Ich habe nur eines noch nicht verstanden: Was bringt dann overflow:visible? Sollte dieses das nicht eigentlich bewirken? Oder habe ich da etwas falsch verstanden?
Probiere es aus. Ich denke dass dann aber der Text oder das Bild einfach drüberhängen.
Nein, eigentlich soll das Bild dann neben das Menü gepackt werden, und dann halt dort über den rechten Rand hinausgehen (was es ja sowieso tut). Eigentlich sehe ich sowieso keinen Grund, warum das Bild weiter nach unten verschoben wird, da es ja so oder so über den Rand hinausgeht.
Nun so stimmt das nicht ganz. Es hat schon einen Grund. Woher soll der Browser eigentlich wissen ob das nächste Bild auch noch neben dran soll, nur weil das erste schon eh nicht hingepasst hat, oder doch in einer neuen Zeile wo es eventuell auch nicht genügend Platz gibt?
Gibt es wenigstens theoretisch eine Möglichkeit, das Bild mit width so zu formatieren, dass es nur bis zum Rand geht, aber dafür direkt unter der Überschrift ist? Wenn ich es mit width:100% belege, ist es immernoch unterhalb der Navigation.
Naja für neuere Browser kannst du max-width: x%; angeben wobei
x = 100% - (Menübreite in %) - (margin + border + padding Menü in %) - (margin + border + padding Bild in %)
ist. Die höhe gibst du einfach nicht an, dann passt sie sich automatisch an. Das geht aber im IE nicht. Somit wird das Bild immer kleiner als der zur verfügung stehende Platz und es wird nicht nach unten geschoben. Andererseits wird es auch nie vergrößert und pixelig wenn doch mal mehr Platz zur verfügung steht.
Grüße
Jeena Paradies
Hiya Jens,
Einen schönen Abend noch,
Jens
Kannst du mir und Dir bitte einen Gefallen tuen?
Poste doch bitte unter einem anderem Namen.
Ich bin hier schon seit 1998 im Forum, und immer mit
dem selben Namen. Das ich nicht soviel Poste liegt
teilweise da dran, das ich an 2 Computern arbeite,
und auch an meiner Eigenen Scheuheit ein wenig.
Ich weiss selber sehr Gut, Jens ist ein haeufig
auftretender Name, und Mueller is kein Name, dat
is'n Sammelbegriff. (Nur 3 Haueser weiter, wohnen
auf meiner Strasse noch mehr Muellers, und nur 2
Strassen weiter von mir, Wohnt noch ein Jens
Mueller :o)
Eigendlich hatte ich ja auch angeclickt das nur
mit Registrierung dieser Name verwendet werden kann.
Dies verusachte jedoch Probleme und ist zur Zeit
abgeschaltet.
Danke dir
gruesse aus'm ruhrpott
jens mueller