Div Variabel? |
Willkommen, Gast ( Anmelden | Registrierung )
Div Variabel? |
Gast_Cyber-Surfer_* |
25.04.2004 - 23:18
Beitrag
#1
|
Gäste |
Hallo
ich möchte auf meiner Seite 2 Blockelemente mit div realisieren die nebeneinander stehen. Einer rechts (navigation) ausgerichtet und bleibt auch dort beim verkleinern des Brauserfensters Der 2te soll links (Text) sein und sich in der größe so anpassen das sie sich nicht Überlappen (ähnlich wie tabellen). Wer weiß was? Gruß Cyber-Surfer |
|
|
Gast_heinzelhund_* |
25.04.2004 - 23:28
Beitrag
#2
|
Gäste |
|
|
|
25.04.2004 - 23:58
Beitrag
#3
|
|
looks good Gruppe: User Beiträge: 43 Mitglied seit: 17.02.2004 Mitglieds-Nr.: 2.047 |
Ich würds nicht unbedingt absolut positionieren und man kann auch %-Angaben machen bei den <div>s.
Eine weitere gute Seite wäre diese hier: http://css.fractatulum.net/index.htm Zum Positionieren-Üben der <div>s gibt es dort auch diesen schönen Online-Editor - am besten zwei Browser gleichzeitig aufrufen und testen - viel Spaß, ist nämlich durchaus ein Puzzle-Spiel, das Ganze, bis es endlich in allen Browsern richtig sitzt... Aber prinzipiell müßte sich das machen lassen mit float - Angaben, damit sich dann der zweite <div>-Container daneben legt. |
|
|
26.04.2004 - 0:03
Beitrag
#4
|
|
Kann auf gar keinen Fall einen Videorekorder programmieren! Gruppe: User Beiträge: 210 Mitglied seit: 08.12.2003 Wohnort: Bad Zwischenahn Mitglieds-Nr.: 1.751 |
Conny würde floaten ;-)
Ich würde es auch mit %-Angaben machen 80%haupt und 20% menü und absolut positionieren. Gruß uschi |
|
|
26.04.2004 - 0:05
Beitrag
#5
|
|
Anwärter auf W3.org Mitgliedschaft Gruppe: User Beiträge: 550 Mitglied seit: 28.11.2001 Wohnort: Berlin Friedrichshain Mitglieds-Nr.: 107 |
Hallo
ZITAT ich weiß was. Und damit ich nicht alleine bleibe "absolut Positionieren" Die Beschreibung (speziell das Beispiel) geht aber so nicht auf die wirklich variable Breite ein. Besonders die Beschreibung von position:relative ist mehr als verwirrend bzw. unbefriedigend. Ich habe mir aber ein Workaround (mehr ist es wohl nicht) gebastelt. CSS: QUELLTEXT #left { left:10px; top:10px; padding-right:200px; position:absolute; } #right { right:10px; top:10px; width:180px; position:absolute; z-index:2; } HTML: QUELLTEXT <html> <head> <!-- Head-Angaben --> </head> <body> <div id="left"> <!-- Hier der Inhalt --> </div> <div id="right"> <!-- Hier z. B. die Navi --> </div> </body> </html> Das Problem ist, daß es mit NS 4 nicht funktioniert. Wäre die Navigation auf der linken Seite, würde es funktionieren (mit Umbau wegen padding). Ist also nur noch die Frage, ob dies noch jemanden ernsthaft interessiert. Nachtrag: bei #right z-index hinzugefügt, um auf die dortigen Elemente Zugriff zu haben. Tschö, Auge Der Beitrag wurde von Auge bearbeitet: 26.04.2004 - 12:26 |
|
|
26.04.2004 - 0:10
Beitrag
#6
|
|
Kann auf gar keinen Fall einen Videorekorder programmieren! Gruppe: User Beiträge: 210 Mitglied seit: 08.12.2003 Wohnort: Bad Zwischenahn Mitglieds-Nr.: 1.751 |
Es sollte noch ernsthaft interessieren ;-)), es gibt nun mal noch viele, die den 4.xx von netscape benutzen.
Das Menü rechts ist vor allem dann nötig, wenn man seine Seiten auch für Blinde-Surfer praktikabel machen will, denn denen wird dann zuerst der Text und dann die Menülinks vorgelesen. Weiß kaum einer, aber ist ne Überlegung wert. Gruß und gute Nacht Uschi |
|
|
26.04.2004 - 0:15
Beitrag
#7
|
|
looks good Gruppe: User Beiträge: 43 Mitglied seit: 17.02.2004 Mitglieds-Nr.: 2.047 |
Ich hab grad mal folgendes getestet:
<div style="width:150px; height: 350px; position:absolute; top:100px; right:50px;">Navi:</div> <div style="width:60%; height:500px; float:right; margin-right:220px;">Hauptcontainer</div> Geht im Firefox einwandfrei - aber im IE überhaupt gar nicht! Da floated der Hauptcontainer kein Stück nach rechts, und wenn ich (wie oben) - mehr als 50% width für den Hauptcontainer angeben, dann verschwindet plötzlich der Navi-Container ??? Gibts dafür ne Erklärung oder ist mein Denkansatz so vollkommen falsch? Wäre schön, wenn mir mal einer der Experten da helfen könnte... Edit: Beide floaten klappt allerdings (zumindest im IE 6.0 und im Firefox): <div style="width:150px; height: 350px;float:right; margin-right:20px;">Navi:</div> <div style="width:60%; height:1500px; float:right; margin-right:20px;">Hauptcontainer</div> Der Beitrag wurde von Terry bearbeitet: 26.04.2004 - 0:24 |
|
|
26.04.2004 - 6:34
Beitrag
#8
|
|
____________________ Gruppe: Admin Beiträge: 1.220 Mitglied seit: 20.10.2001 Mitglieds-Nr.: 3 |
ZITAT(amethyst @ 26.04.2004 - 1:10) Es sollte noch ernsthaft interessieren ), es gibt nun mal noch viele, die den 4.xx von netscape benutzen. Hi, das ist hoffentlich nicht ganz ernst gemeint. Es sind definitiv weniger, als die Usergruppe, welche ohne Javascript - aus welchen Gründen auch immer - unterwegs ist. Und *diese* Usergruppe wird immer vergessen. Wozu also um den NN4.x scheren? Die Nicht-Javascripter sind doch viel wichtiger, da mehr! Grüße Andreas |
|
|
26.04.2004 - 7:32
Beitrag
#9
|
|
Ausnahme Poster Gruppe: User Beiträge: 147 Mitglied seit: 14.07.2003 Wohnort: Schwäbisch Gmünd Mitglieds-Nr.: 947 |
@Terry
Hi Terry, soweit ich mich erinnere: Wenn du mit float positionierst erst den Container, der positioniert wird, dann den Container der sich am ge'floateten' orientieren soll im Code plazieren. Beispiel: QUELLTEXT <div style="float: right;">Navigationsmenü mal rechts ausgerichtet</div> <div> Dies ist der Inhalt, der links von der Navigation erscheint</div> Kanns gerade nicht ausprobieren, weil ich meinen Rechner neu einrichte und Phase noch nicht wieder installiert hab. |
|
|
26.04.2004 - 8:29
Beitrag
#10
|
|
looks good Gruppe: User Beiträge: 43 Mitglied seit: 17.02.2004 Mitglieds-Nr.: 2.047 |
Hallo Ede,
da hast Du schon recht und das funktioniert ja auch - s. Edit. Aber im 1. Versuch sollte sich der zweite Container ja auch gar nicht am ersten ausrichten, sondern am Body - deshalb ja das große margin-right. Erreichen wollte ich damit, dass er Navi-Container ein wenig "runter" kommt und nicht oben mit dem anderen zusammen anfängt. (O.k. - Läßt sich natürlich auch mit margin-top beim floaten erreichen...) Wie gesagt - der Firefox zeigt es so an, wie ich es mir vorgestellt habe, der IE kommt mit der Angabe überhaupt nicht klar, er läßt dabei sogar den Navigationscontainer ganz verschwinden, sobald der Hauptcontainer >50% hat. Nun ja, also bleibt man besser bei einer Positionierung - entweder nur floaten oder nur absolut positionieren, um den armen IE nicht zu verwirren... |
|
|
Google Bot |
Beitrag
#
|
Google Ads |
|
|
|
Vereinfachte Darstellung | Aktuelles Datum: 24.04.2024 - 8:02 |