online 1
gast (50)

/ Forum / Webseiten/HTML

Webseiten/HTMLWebseiten/HTML

Fragevon BenterA vom 24.04.2020, 14:20 Options

CSS- Unterschiede FF/IE

Hallo,

ich hab folgendes Script im Netz gefunden und es optisch an meine Seite angepasst. Soweit ist alles in Ordnung nur möchte ich die Bildergallerie auf mein Hintergrundbild setzten (Muss ziemlich genau sitzen) Problem: Wenn es im FF passt ist es im IE zu weit links!?

http://www.cssplay.co.uk/menu/gallery_click#nogo

es handelt sich um die erste Version.

Ist das einfach ein Unterschied der Browser oder könnte man das Problem irgendwie lösen?

Vielen Dank

Gruß

Ben


Antwort schreiben

Antwort 1 von son_quatsch vom 24.04.2020, 15:17 Options

Die Seite hinter dem Link sieht sowohl in MSIE 6.0 als auch in FFOX 1.5 identisch aus. Jetzt bräuchte ich mehr Details, sprich: deine Version des Codes.

Antwort 2 von BenterA vom 24.04.2020, 15:24 Options

alles klar, bei mir siehts dann so aus:



<style type="text/css">

/* needed for IE to make :active state work first time */
a, a:visited {color:#000;} 


a.gallery, a.gallery:visited {display:block; display:inline-block; color:#000; text-decoration:none; border:1px solid #000; width:55px; height:27px; float:left; margin:4px; z-index:50;}
a.slidea {background:url(images/burg_thumbs/Luftbild.jpg);}
a.slideb {background:url(images/burg_thumbs/P5200041.jpg);}
a.slidec {background:url(images/burg_thumbs/P6260041.jpg);}
a.slided {background:url(images/burg_thumbs/P6260054.jpg);}
a.slidee {background:url(images/burg_thumbs/P7010013.jpg);}
a.slidef {background:url(images/burg_thumbs/Luftbild.jpg);}
a.slideg {background:url(images/burg_thumbs/P5200041.jpg);}
a.slideh {background:url(images/burg_thumbs/P6260041.jpg);}
a.slidei {background:url(images/burg_thumbs/P6260054.jpg);}
a.slidej {background:url(images/burg_thumbs/P7010013.jpg);}

a.gallery em, a.gallery span {display:none;}
a.gallery:hover {border:1px solid #fff;}



#container_top {position:relative; width:425px; height:480px; ; border:0px solid #000000; margin:1em auto;}




#container_top a.gallery:active, #container_top a.gallery:focus {border:1px solid #000;}
#container_top a.gallery:active em, #container_top a.gallery:focus em {display:block; position:absolute; width:400px; height:250px; top:100px; left:5px; padding:0px; color:#000; border:0px solid #3d330f; z-index:50;}
#container_top h1 {clear:both; margin:0; padding-top:200px; text-align:center; font-family: georgia, "times new roman", serif; font-size:3em; font-weight:normal; color:#fff;}
#container_top h1 em {font-size:0.6em; color:#000;}



</style>

<div id="container_top">
<div class="thumbs">
<a class="gallery slidea" href="#nogo"><em><img src="images/Burg/Luftbild.jpg"  /></em></a>
<a class="gallery slideb" href="#nogo"><em><img src="images/Burg/P5200041.jpg"  /></em></a>
<a class="gallery slidec" href="#nogo"><em><img src="images/Burg/P6260041.jpg"  /></em></a>
<a class="gallery slided" href="#nogo"><em><img src="images/Burg/P6260054.jpg"  /></em></a>
<a class="gallery slidee" href="#nogo"><em><img src="images/Burg/P7010013.jpg" /></em></a>
<a class="gallery slidea" href="#nogo"><em><img src="images/Burg/Luftbild.jpg"  /></em></a>
<a class="gallery slideb" href="#nogo"><em><img src="images/Burg/P5200041.jpg"  /></em></a>
<a class="gallery slidec" href="#nogo"><em><img src="images/Burg/P6260041.jpg"  /></em></a>
<a class="gallery slided" href="#nogo"><em><img src="images/Burg/P6260054.jpg"  /></em></a>
<a class="gallery slidee" href="#nogo"><em><img src="images/Burg/P7010013.jpg" /></em></a>



</div>


</div>


gruß

ben

Antwort 3 von son_quatsch vom 24.04.2020, 15:35 Options

Bitte entweder einen Link zu deinem Beispiel online, damit ich das auch nachvollziehen kann und/oder zwei Screenshots, die die Unterschiede zeigen.

Pauschal kann ich nur sagen: eventuell sind nicht alle Elemente grundlegend definiert, so dass der FFOX einen paar Elementen eine Standardverdickung mitgibt, die der MSIE standardmäßig auf 0 hat... (ich spreche von padding und margin).

Antwort 4 von BenterA vom 24.04.2020, 15:40 Options

hi,

die Seite ist leider noch nicht online :)

Habe es jetzt gelöst, indem ich den obigen Code noch in einen Container gepackt hab. Das funktioniert soweit :)

Hat das irgendeinen Nachteil?

Sorry, ist meine erste Website

Antwort 5 von son_quatsch vom 24.04.2020, 16:01 Options

So gut wie nie, höchstens die Übersichtlichkeit des Codes leidet. Ansonsten Gratulation :-)

Antwort 6 von BenterA vom 24.04.2020, 16:06 Options

dann bin ich beruhigt! ;)

..der Code is eh schon lang nicht mehr übersichtlich.

trotzdem vielen Dank für deine schnelle Hilfe!

Antwort 7 von derpfleger. vom 24.04.2020, 23:35 Options

Probleme dieser Art enstehen meist durch unterschiedliche Browser-Voreinstellungen.
Im CSS fügt man also ein:
html, body {margin:0; padding:0;}

denn hieran liegts meist.

Gruß derpfleger

Antwort 8 von katy vom 25.04.2020, 06:57 Options

Hallo Ben,

Zitat:
Wenn es im FF passt ist es im IE zu weit links!?
fordert bei mir eigentlich immer die erste Frage heraus: ist der IE etwa im Quirksmodus? Das ist ein Arbeitsmodus, in dem Browser es mit dem Quellcode nicht so genau nehmen. Der IE geht zB dann in den Quirksmodus, wenn du keine vollständige Doctype-Declaration am Anfang des Quelletxt hast. Gerade im Bereich margin und padding macht der IE im Quirksmodus aber böse Fehler weshalb die Seite dann völlig anders als in anderen Browsern aussehen kann nur wegen einer fehlenden Zeile am Quelltextanfang.

katy

Antwort 9 von BenterA vom 25.04.2020, 08:30 Options

hallo,

hab ich denn hier eine unvollständige Deklaration?:



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



hab zumindest nicht bewusst diesen Modus gewählt. Kannte ihn ehrlich gesagt auch noch nicht :)

@ derpfleger:

Könntest du mir vielleicht erklären, wo genau ich margin und padding auf 0 setzen sollte?

sorry, ich kanns nicht oft genug sagen. ich muss diese seite machen und hab davon keine ahnung und leider auch keine zeit mehr, bei den grundlagen zu beginnen, auch wenn ich das gern machen würde. ich bitte um nachsicht ;)

Ähnliche Themen

Befehlstabelle für css
fabi1991  12.04.2007 - 107 Hits - 6 Antworten

CSS-Stile sind verschwunden
Luse  13.04.2007 - 129 Hits - 2 Antworten

css in html einfügen
Mikoop  22.02.2008 - 202 Hits - 10 Antworten

Direktformatiertes CSS "überschreiben"
Mich  23.02.2008 - 76 Hits - 3 Antworten

eigene klasse in css
TByte  11.04.2008 - 73 Hits - 34 Antworten

Hinweis

Diese Frage ist schon etwas älter, Sie können daher nicht mehr auf sie antworten. Sollte Ihre Frage noch nicht gelöst sein, stellen Sie einfach eine neue Frage im Forum..

Neue Einträge

Version: supportware 1.9.150 / 10.06.2022, Startzeit:Thu Jan 8 21:07:44 2026