CSS Darstellungsunterschied Firefox & IE

Dieses Thema im Forum "Webentwicklung" wurde erstellt von Gilmohr, 15. Januar 2009 .

Schlagworte:
  1. 15. Januar 2009
    Hallo alle zusammen,
    ich weis mal wieder nicht weiter bei einer sache und wär über Antwort Dankbar !

    Bin ja mitlerweile von dem Tabellenmissbrauch weg und versuche nun saubere Webseiten nur mit html und CSS zu Layouten. Allerdings macht mir der Internetexplorer ständig nen strich durch die Rechnung.

    meine frage an euch, wie bekomme ich die Ganze Seite so geschrieben, dass Sie ständig und in jedem Browser gleich angezeigt wird? Das muss doch möglich sein, schließlich werden Professionelle Seiten auch Gleich angezeigt.
    Kann ich evtl mit nem speziellen befehl den I.E seperat ansprechen und dadurch evtl di fehler korrigieren?

    Vielen Dank schonmal.
     
  2. 15. Januar 2009
    AW: CSS Darstellungsunterschied Firefox & I.E.

    Stichwort Browserhacks und Browserweichen -> Google
    Und Tabellen sind auch HTML
     
  3. 16. Januar 2009
    AW: CSS Darstellungsunterschied Firefox & I.E.

    Ohne jemanden zu beleidigen und oder so, aber Browserweichen und -hacks sind totaler Fusch,
    wenn man sauber programmiert und bisschen rumprobiert geht alles ohne Weichen und Hacks das einzige wo man vllt n Hack benutzen kann ist bei transparenten PNG's


    @Gilmohr
    Hast du spezielle Fragen? oder Probleme? Wie gesagt mit bisschen rum probieren Erfahrung und Geduld kriegt man es auf jeden Fall hin.
     
  4. 16. Januar 2009
    AW: CSS Darstellungsunterschied Firefox & I.E.

    Manchmal ist der IE schon eine Geschichte für sich, dafür kan man volgendes verwenden:

    HTML:
    <!--[if IE]>
    
    <style type="text/css">
     /* hier deine css-angaben die nur vom IE interpretiert werden */
    </style>
    
    <![endif]-->
    
     
  5. 16. Januar 2009
    AW: CSS Darstellungsunterschied Firefox & I.E.

    Besorg dir eine reset.css, damit kannst du den vordefinierten style aller Browser zuerst auf null setzen und dann deinen style definieren lassen!

    Damit kann man dem IE Problem sehr gut Herr werden!
     
  6. 16. Januar 2009
    AW: CSS Darstellungsunterschied Firefox & I.E.

    Also ich hab mir grad das erste mal so ne Reset CSS angeschaut:
    Erics Archived Thoughts: Reset Reloaded
    Erstmal: Wenn ich html "resetet" hab, wozu soll ich dann noch die anderen Elemente reseten? Wird ja vererbt.
    Dann ist eigentlich das Wichtigste für einen Reset margin und padding auf 0 zu setzen. Trotzdem kommt es vor, dass, wenn man ein komplexeres Template hat, es zwangsweise zu Anpassungen kommen muss, gerade wegen Abständen.

    @Peter2k: Ich stimm dir zu, dass man es so anpassen kann, dass es überall gleich aussieht oder zumindest identisch wirkt. Ich mach das meistens auch so, dass ich es erst z.B. mit anderen Methoden versuche, anders zu floaten oder sonst was. Man bräuchte hier jetzt den Code, um zu sagen, ob man das auch so lösen kann.
    Seine Frage war aber auch z.B.
    Also gib ich ihm die Antwort

    Also, auch wenn ich als erstes versuchen würde, es so hinzubekommen, würde ich nach längerer Arbeit auf Browserhacks zurück greifen und gegen Browserweichen hätte ich sowieso nichts einzuwenden, denn auch professionelle Seiten (seine Frage nach diesen), verwenden Browserhacks. Wenn der IE die Möglichkeit bietet, kann man diese auch wahrnehmen. Du kannst auch bei deiner Browserweiche für den IE body{ display: none; } eingeben, so einfach xD
    Und auch Browserhacks find ich ganz gut, wenn einem die Möglichkeit schon gegeben wird.
    Die einzelnen Browser haben ja auch z.B. spezielle CSS-Befehle, die nur sie interpretieren. Sowas finde ich z.B. nicht gut, weil man dann das Risiko eingeht, dass sie unterschiedlich aussieht. Manche stellen natürlich auch Alternativen zur Verfügung wie z.B. der Alphawert von FF und IE.
     
  7. 16. Januar 2009
    AW: CSS Darstellungsunterschied Firefox & IE

    Also erstmal vielen Dank für die vielen Medungen.
    Meine Frage ob ich den I.E speziel ansprechen kann wurde auch beantwortet. :]

    Sicherlich würd ich evtl nach langem probieren eine passende möglichkeit finden, allerdings hab ich schon unzählige stunden hier verbraten und komm an dem punkt nicht weiter.

    hab hier mal die seite gepostet, einmal den Link, könnt ihr euch ja dann in FireFox und I.E mal ansehen, quelltext kann man ja auch einfach nachschauen

    die CSS Datei sieht folgendermasen aus:
    Code:
    
    body { font-family: Verdana;
     font-size: 13px;
     color: #000000;
     background-color: #ffffff;
     margin:0px 00px 0px 0px;
     text-align:center;}
    
    #layout {border:0px solid #999999;
     min-width: 900px;
     min-height: 498px;
     position: relative;
     top: -13px;
     background-image: url("../gfx/Layout222_02.jpg");
     filter:alpha(opacity=100); -moz-opacity: 1.00; opacity: 1.00;
     background-position: 50% top;
     background-repeat: no-repeat;}
    
    #inhalt {width:600px;
     border:0px solid #aaaaaa;
     text-align:left;
     position:relative;
     left: 200px;
     top: 20px;}
    
    #background {background-image: url("../gfx/Layout222_03.jpg");
     background-repeat: repeat-y;
     position:absolute;
     background-position: 50%;
     text-align:center;}
    
    .navi {width:120px; float:left;
     border:0px dashed #aaaaaa;
     line-height:18px;
     margin-top:0px;
     margin-left:30px;
     position:absolute;}
    
    a {color:#746a51;
     text-decoration: none;
     font-weight: bold;}
    a:hover {color:#746a40;
     text-decoration: underline;
     font-weight: bold;}
    
    a.link {
     display:block;
     -moz-border-radius:20px;
     -khtml-border-radius:10px; :10px;
     width:100px;
     padding:3px;
     margin:10px;
     background-color:#746a51;
     border:0px solid #fdfcea;
     text-align:center;
     font-weight:bold;
     font-size:12px;
     color:#ffffff;
     text-decoration: none;}
    
    a.link:hover {
     border-left:0px solid #848484;
     border-top:0px solid #848484;
     background-color:#746a40;
     border-right:0px solid #ffffff;
     border-bottom:0px solid #ffffff;
     text-decoration: none;}
    
    
    geht zwar mit sicherheit einfacher oder besser, aber bin ja noch am lernen...
    evtl kann mir der ein oder andere ja en tip zur verbesserrung geben
     
  8. 16. Januar 2009
    AW: CSS Darstellungsunterschied Firefox & IE

    am besten du postest dein HTML code gleich mit dann kann man dir besser weiter helfen wegen dem HTML aubau zum CSS =)
     
  9. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.