• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

ff prob

Status
Für weitere Antworten geschlossen.
und antworten brauchen auch mal zeit, man kann nicht erwarten dass hier sofort geantwortet wird. :wink:
 
Hi tunichtgut.de.be

leider ist es fast unmöglich durch dein Quelltext-Salat durchzusteigen. Wenn du noch an Hilfe interessiert bist poste folgende Sachen:
1.) Den Quelltext vom oberen rechten Bild mit dem Punkt und den davon weglaufenden Adern, bis zur Div in der der obere Rahmen definiert ist.
2.) Die dazugehörigen CSS Formatierungen aus der CSS Datei.
3.) Eine Erklärung des Quelltextes welche Div was bedeutet

Und selbst wenn du es machst sehe ich da nur wenig Hoffnung, weil du absolute und relative Positionierung mischt und da verhalten sich die Browser halt stark unterschiedlich. Man sollte also nur das Eine oder das Andere verwenden. :roll:

Gruß
Hobbyuser
 
habt recht, die source is ´n bissel unübersichtlich und man kann auch nicht verlangen, dass sich alle user bei jedem hilfesuchenden durch den quelltext durcharbeiten.
k, also der quelltext ist der folgende :
für die 3 elemente, die nebeneinander stehen sollen ...
Code:
*.ol {float:left;margin-left:20px;margin-top:47px}
/* das "adrige" bild mit dem punkt in der mitte, floatet links */
*.or {float:right;margin-right:61px;margin-top:20px}
/* dieses bild floatet ganz rechts außen, bei richtiger margin-top angabe in der selben höhe wie ol, da kein clear:right eingefügt wird*/
*.t {width:100%;margin-right:100px;Height:1px;float:left}
/* Knackpunkt : "t" ist eine 4px hohe Leiste, die auch rechts floatet, nicht ganz rechts außen weil sie ja nach or float:right aufweist. sie müsste so eigentlich zwischen ol und or sein und immer den gesamten wischenraum zwischen ol und or ausfüllen, da width="100%" !  */

+ html - teil ,der sieht so aus ...

Code:
<DIV  class="ol" >
[img]http://localhost/include/ol2.png[/img]
</div>
<DIV class="or"  >
[img]http://localhost/include/or.jpg[/img]
</div>
<div class="t"> 
[img]http://localhost/include/13.png[/img]
</div>

diese elemente solen genauso nebeneianderstehen, wie es bei der datei http://tunichtgut.coolx.ws/tuts/adern.php beim ie und opera der fall ist und gleichzeitig auch genauso skalierbar sein wie beim ie und opera

ich habe eine kleine testdatei geschrieben, die die site nochmal auf das wesentlich problem reduziert . Die browserweiche lädt die zum jeweiligen Browser passenden styledefinitionen, ihr braucht euch natürlich nur auf die style_ff_test (für firefox) zu konzentrieren. ich habe die anderen stylesheets zu demo-zwecken hochgeladen, dann könnt ihr auch die eigentlich erwünschte darstellungsform mit opera / ie sehen. testet es bitte mit dem ie oder opera bevor ihr für den ff testet, damit ihr seht wie´s eigentlich sein soll...
-> http://tunichtgut.coolx.ws/test.php

EDIT: ...ist noch jemand da ???
 
Vllt. dauert es etwas, bis jemand eine Lösung hat

mfg Plankton
 
Also tunichtgut.de.be, du musst bei "ol" und "or" eine Breite (width) angegeben. Dann wird wird die "t" Div automatisch auf die Länge zwischen den beiden Äußeren gekürzt. Sprich du musst dort die Breite von 100% entfernen.

Wobei ich bei dieser Lösung keine Garantie auf die richtige Höhe der Divs geben kann. :lol:
 
hab deine ratschläge beherzigt und es jetzt so gemacht :

Code:
*.ol {float:left;margin-left:20px;margin-top:47px;width:29px}
*.t {height:4px;margin-top:61px;float:left;width:auto}
*.or {float:right;margin-right:61px;width:222px}

html teil :

Code:
<DIV  class="ol" >
[img]http://localhost/include/ol2.png[/img]
</div>
<div class="t"> 
[img]http://localhost/include/13.png[/img]
</div>
<DIV class="or"  >
[img]http://localhost/include/or.jpg[/img]
</div>

Alternativ habe ich auch mal nur bei einem der beiden Teile (html oder css) die width mit 100% für *.t angegeben.
Funktioniert aber alles nicht...
 
Du musst noch 2 Änderungen vornehmen:

1.) Die Reihenfolge der Divs im Quelltext ändern (Links, Rechts, Mitte)
Code:
<DIV  class="ol" > 
[img]http://localhost/include/ol2.png[/img] 
</div> 
<DIV class="or"  > 
[img]http://localhost/include/or.jpg[/img] 
</div>
<div class="t"> 
[img]http://localhost/include/13.png[/img] 
</div>

2.) Das "float:left;" und "width:auto;" aus dem CSS von "t" entfernen.

Ähnlich wie auf dieser Testseite. ;)
 
danke für deine Mühe.
hab´s jetzt so :
Code:
*.ol {float:left;margin-left:20px;width:29px}
*.t {height:4px}
*.or {float:right;width:222px}

Code:
<DIV  class="ol" >
[img]http://localhost/include/ol2.png[/img]
</div>
<DIV class="or"  >
[img]http://localhost/include/or.jpg[/img]
</div>
<div class="t"> 
[img]http://localhost/include/13.png[/img]
</div>

klappt immer noch nicht (siehe http://tunichtgut.coolx.ws/test.php)

Mod-Edit: Code-Tags verwenden! (Prophet)
 
sowas mein' ich, die leute lernens nie, wenn sie fertigen code zum fressen bekommen.

also wirklich, schonmal dran gedacht, die pfadangaben zu verändern?

tunichtgut.de.be's webseite schrieb:
Code:
[img]http://localhost/include/13.png[/img]

wie soll der das im netz finden, wenn die pfadangabe überhaupt nicht stimmt?!

Nils aka XraYSoLo
 
man lol, das war mein offline code, auf der online-test.php hab ich´s natürlich geändert, lol. Es ging hier um die Reihenfolge /Css Attribute.

Hab jetzt ne viel geilere Lösung gefunden *stolz* :
Ich verpacke das content - div einfach mit anderen divs, deren Rahmen genauso aussehen wie das bild von "*.t".
Die Bilder von "*.ol" und "*.or" lass ich aussehen wie das content - div (hinsichtlich background - color und rahmen, der durch die umliegenden rahmendivs erzeugt wird) und weise ihnen einen höheren z-index zu!
Ich finde meine Lösung ziemlich gut, da damit auch rechts eine Abtrennung entsteht, der Firefox problemlos die Angaben interpretiert und sich die stylesheets für die versch. Browser nun auch nicht mehr soooo stark unterscheiden.

bitte schaut´s euch an (der link ist ausnahmsweise mal richtig:):
http://tunichtgut.coolx.ws/in.php
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben