ilch Forum » Allgemein » HTML, PHP, SQL,... » IE vs. Firefox: Position CSS o.a.

Geschlossen
  1. Mo. 23.09.2013 20:44 Uhr #1
    User Pic
    Raptusguru Mitglied
    Registriert seit
    10.02.2010
    Beiträge
    148
    Beitragswertungen
    11 Beitragspunkte
    Hallo Leute,

    Ich habe ein kleineres Problemchen.

    Und zwar ärgert mich der tolle IE ein bisschen.

    Mein Problem ist, dass ich 2 buttons Positionieren möchte. Im Firefox kein problem, aber mein "bester" der IE will mal wieder nicht und positiert die buttons woanders hin bzw. verschiebt sie um einige 50px.

    Bitte kann mir einer ein geheimnis verraten wie ich dem IE zuflüstere, dass er das tun soll was ich will und nich das was er will???

    hier der Code um den es geht.

    p.s. Da mich der IE schon sehr genervt hat steht nun sehr viel "hidefocus" drinne. evtl. kann mir jemand sagen wo es unnötig ist ^^.

    der code befindet sich in einer "table" fals das hilfreich sein sollte. xD 

    <tr>
	  <td width="1200" background="include/designs/uc/images/Header_oben.jpg" height="51" align="left" valign="top">
		<div hidefocus><a href="index.php?gbook" style="position:relative; left:18px; top:23px;" hidefocus><img hidefocus  width="120" height="21" src="include/designs/uc/images/navi/gbout.jpg" onmouseover="src='include/designs/uc/images/navi/gbover.jpg'" onmouseout="src='include/designs/uc/images/navi/gbout.jpg'" onmousedown="src='include/designs/uc/images/navi/gbdown.jpg'" hidefocus/></a>
		<a href="index.php?links" style="position:relative; left:944px; top:23px;" hidefocus><img  width="120" height="21" src="include/designs/uc/images/navi/linkusout.jpg" onmouseover="src='include/designs/uc/images/navi/linkusover.jpg'" onmouseout="src='include/designs/uc/images/navi/linkusout.jpg'" onmousedown="src='include/designs/uc/images/navi/linkusdown.jpg'" hidefocus/></a>
		</div>
       </td>
	</tr>


    Danke erstmal. MFG Raptusguru


    verwendete ilchClan Version: 1.1 P
    0 Mitglieder finden den Beitrag gut.
  2. Mo. 23.09.2013 21:42 Uhr #2
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Was ist hidefocus? Normal ist das kein Attribut, ich denke auch nicht, dass du das so beabsichtig hast, vielleicht class="hidefocus"´?

    Generell muss auch das Elternelement position: relative/absolute; haben (reich auch ohne geänderte Position), wenn du ein Kind darin positionieren willst.
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  3. Mo. 23.09.2013 21:48 Uhr #3
    User Pic
    Raptusguru Mitglied
    Registriert seit
    10.02.2010
    Beiträge
    148
    Beitragswertungen
    11 Beitragspunkte
    Also ich dächte hidefocus ist der befehl für den IE das er keinen grauen Rahmen um die Links oder Bild-Links zieht. das hat sogar so funktioniert bei meiner Navi. blos das mit dem Papa und kind musste mir jetzt nochmal erklären. Wie ist das mit dem Stammbaum, wer ist elternteil.

    Meinst du die Zeile???
    0 Mitglieder finden den Beitrag gut.
  4. Mo. 23.09.2013 22:23 Uhr #4
    User Pic
    Raptusguru Mitglied
    Registriert seit
    10.02.2010
    Beiträge
    148
    Beitragswertungen
    11 Beitragspunkte
    Sorry Mairu,
    ich hab mich vertan.

    also hidefocus war dafür, damit der IE nicht diese gestrichelte umrandung anzeigt wenn die maus eine Link überfährt bzw ein Bild-Link.

    So und mein problem war u.a. ein grauer Rahmen um den Button, den ich mit style="border:0;" weg bekommen habe. die buttons sind jetzt zwar da wo sie sein sollen, jedoch kommt mir das immernoch so vor als ob im IE der eine Button etwa 1-2px drüberschaut. woran das nun liegt???

    externer Link

    externer Link

    Oberer screen ist firefox, unterer IE 

    <tr>
      <td width="1200" background="include/designs/uc/images/Header_oben.jpg" height="51" align="left" valign="top">
        <div hidefocus><a href="index.php?gbook" style="position:relative; left:18px; top:23px;" hidefocus><img style="border:0;" hidefocus  width="120" height="21" src="include/designs/uc/images/navi/gbout.jpg" onmouseover="src='include/designs/uc/images/navi/gbover.jpg'" onmouseout="src='include/designs/uc/images/navi/gbout.jpg'" onmousedown="src='include/designs/uc/images/navi/gbdown.jpg'" hidefocus/></a>
        <a href="index.php?links" style="position:relative; left:944px; top:23px;" hidefocus><img style="border:0;"  width="120" height="21" src="include/designs/uc/images/navi/linkusout.jpg" onmouseover="src='include/designs/uc/images/navi/linkusover.jpg'" onmouseout="src='include/designs/uc/images/navi/linkusout.jpg'" onmousedown="src='include/designs/uc/images/navi/linkusdown.jpg'" hidefocus/></a>
        </div>
       </td>
    </tr>


    praktisch erstmal nur den Style border geändert


    Zuletzt modifiziert von Raptusguru am 23.09.2013 - 22:27:34
    0 Mitglieder finden den Beitrag gut.
  5. Mo. 23.09.2013 23:23 Uhr #5
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Also damit Bilder keinen Rahmen erhalten, border auf 0 setzen, wie du selbst schon geschrieben hast. hidefocus hab ich vorher noch nie gehört, und sollte nicht notwendig sein.

    Ich habs eigentlich schon geschrieben gehabt, gibt dem Div in dem die Links drin sind mal position:relative;, ich seh auf den Screens auch irgendwie das Problem nicht, irgendwie ist doch alles gleich? zunge
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  6. Mo. 23.09.2013 23:31 Uhr #6
    User Pic
    Raptusguru Mitglied
    Registriert seit
    10.02.2010
    Beiträge
    148
    Beitragswertungen
    11 Beitragspunkte
    Also auf den screens, da sehe ich beim IE-screen beim rechten button (linkus) eine pixel der rüberschaut auf den rahmen. schlechte qualität der screen, aber man kann es sehen. grumml

    Danke für die erklärung mit dem eltern teil. Also ist praktisch immer das davor liegende/drüber liegende das elternteil, alles was drunter ist oder drinne das Kind. so hab ich das jetzt verstanden.

    zwinker

    so, denn wenn ich den pixel runter gehe von 940 auf 939px dann fehlt er im firefox und im IE siehts top aus.
    Woher nimmt der diesen pixel???


    Zuletzt modifiziert von Raptusguru am 23.09.2013 - 23:35:17
    0 Mitglieder finden den Beitrag gut.
  7. Di. 24.09.2013 00:09 Uhr #7
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Das kann ich dir anhand von 2 Screens auch nicht sagen, meist kann man mit den Browser Entwicklertools der Sache auf den Grund gehen, für Firefox gibts dann noch Firebug.
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  8. Mi. 25.09.2013 09:31 Uhr #8
    User Pic
    Raptusguru Mitglied
    Registriert seit
    10.02.2010
    Beiträge
    148
    Beitragswertungen
    11 Beitragspunkte
    Hey danke für den Tip mit dem Firebug, das hatt ich auch schon drauf und du hats mich mal wieder animiert das Teil zu benutzen und da iss mir doch glatt was aufgefallen bei den Grafiken ^^.

    Zwar hab ich nun nen anderen kleineren fehler entdeckt, aber immernoch nich warum der IE nen pixel dazu tut, oder auch der firefox einen abzieht, wobei Chrome das auch richtig anzeigt. Also kanns ja nur der IE sein, das schwarze schaf mal wieder...
    0 Mitglieder finden den Beitrag gut.
  9. Mi. 25.09.2013 19:37 Uhr #9
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Also bei mir (IE 10) siehts genau aus, wie im Firefox.
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  10. Mi. 25.09.2013 20:57 Uhr #10
    User Pic
    Raptusguru Mitglied
    Registriert seit
    10.02.2010
    Beiträge
    148
    Beitragswertungen
    11 Beitragspunkte
    Ja mittlerweile, man sieht da jetzt kein unterschied, aber auch nur, weil ich den Button "Link us" nun diesen besagten Pixel nach links gesetzt habe. Das bedeutet, dass nun im IE ein pixel abstand zwischen Button und Rahmen des Designs ist. Des sieht man nicht, außer man weis es, wie ich zunge. Roter Button und Hintergrund das fällt dann nich so auf.

    Ärgert mich aber trotzdem, da ichs ja weis.
    Wie gesagt es ist mir ein Rätsel wie dieser Pixel zustande kommt den der IE sich nimmt.

    Trotzdem erstmal danke für die Eltern<->Kind erklärung ^^.

    Falls du noch ein paar Ideen hast bezüglich des Pixels, bin ich gerne bereit alles zu versuchen, da es mich echt wurmt grumml.

    THX u. MFG

    p.s. mir ist noch was eingefallen/aufgefallen: Kann man in einer .css die position nicht mit left:20px; top:25px; machen?? denn ich muss margin-left und margin-top machen, sonst tut sich nix. In der HTML wiederum funzt left:... ; top:...; .
    Also liege ich da richtig, dass left:... top:... zu HTML gehört und margin-left usw. zu .css ???

    Danke


    Zuletzt modifiziert von Raptusguru am 25.09.2013 - 21:02:36
    0 Mitglieder finden den Beitrag gut.
  11. Do. 26.09.2013 07:34 Uhr #11
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    top und left kann man nur in Verbindung mit position:absolute/relative verwenden.
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  12. Do. 26.09.2013 08:05 Uhr #12
    User Pic
    Raptusguru Mitglied
    Registriert seit
    10.02.2010
    Beiträge
    148
    Beitragswertungen
    11 Beitragspunkte
    hehe, super wieder was gelernt ^^ danke dir. das war halt erstmal meine schlussfolgerung da es so funktioniert hat. aber nun da ich weis wie es geht kann ich mein zeugs hin und her positionieren wie ich lustig bin xD.
    Solange der IE mitmacht zumindest.
    0 Mitglieder finden den Beitrag gut.
Geschlossen

Zurück zu HTML, PHP, SQL,...

Optionen: Bei einer Antwort zu diesem Thema eine eMail erhalten