css problem bei IE
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
abstand
auto
background
boarder
center
datei
design
elemente
extra
formatierung
image
important
margin
minusbereich
null
right
sicherheitslcke
sieben
update
vorredner
-
hy leute... ich hab ein design für ne seite bebastelt und das wird in firefox auch richtig angezeigt jedoch macht der internet explorer da nich ganz mit...
vllt kann mir da einer von euch sagen wie ich des beheben kann...evtl. mit browserweiche aber ich weiß ja nochnich mal was der IE da falsch interpretiert
hier die seite
http://serpiente.energy-gamers.de/designs/standartdesign/index01.html
hier der code der html datei
<body> <div align="center" class="header"></div> <div class="boarder"></div> <div class="nav"> <div class="nav_t"></div> <div class="nav_m"> <p>1</p> <p>2</p> <p>3</p> <p>4</p> <p>5</p> <p>6</p> <p>7</p> <p> <a href="http://validator.w3.org/check?uri=referer"><img style="border:0" src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0 Transitional" height="31" width="88" /></a> </p> <p> <a href="http://jigsaw.w3.org/css-validator/"> <img style="border:0;width:88px;height:31px" src="http://jigsaw.w3.org/css-validator/images/vcss" alt="Valid CSS!" /> </a> </p> </div> <div class="nav_f"></div> </div> <div class="content"> <p>Test;...</p> </div> <div class="boarder"></div> <div align="center" class="footer"></div> </body>
und der der css datei
.header { background-image: url(images/header.gif); background-repeat: no-repeat; background-position: center; position:relative; margin-left:auto; margin-right:auto; height: 149px; width: 996px; } .boarder { background-image: url(images/boarder.gif); background-repeat: repeat-x; height: 5px; width: 100%; margin-right: auto; margin-left: auto; clear: left; } .nav { float:left; } .nav_t { background-image: url(images/nav_t.gif); background-repeat: no-repeat; height: 9px; width: 203px; } .nav_m { background-image: url(images/nav_m.gif); background-repeat: repeat-y; width: 203px; padding-top:1px; padding-bottom: 1px; padding-right: 5px; padding-left: 8px; } .nav_f { background-image: url(images/nav_f.gif); background-repeat: no-repeat; height: 28px; width: 203px; } .content { padding: 20px; margin:auto; } .footer { background-image: url(images/footer.gif); background-repeat: no-repeat; background-position: center; position:relative; margin-left:auto; margin-right:auto; height: 28px; width: 493px; } -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Bei mir sieht sie im IE (7) genauso aus, wie im FF 2 oder Opera 9
-
aber nich in ie6
-
Achso, na ... ich mache mir über Probleme vom IE 6 keine Sorgen mehr.
Fast alle Windows-Rechner werden mit dem Update auf IE 7 umgestellt, wer das nicht möchte, soll sich nicht über ein schlechtes Webdesign beklagen. -
ja aber es gibt viele die die updates von win nich nutzen...
und das is auch besser so!!!
ich selbst nutze auch keine updates.... -
Was ist daran bitte besser?
Wenn du dich über Sicherheitslücken beklagst, solltest du MS auch eine Chance geben, diese zu beheben...
Ausserdem solltest du dich beim IE(6) einfach an falsche CSS interpretation gewöhnen ;)
Ich kenne den siebener nicht, kann deshalb auch nichts sagen, allerdings würde ichmichauch wirklich kein eSorgan machen, da die meisten User auch updaten. -
du ms macht bei updates nich nur sicherheitslücken zu...
und das kann ich selber und das weitaus besser!
aber zum css also gibt es keinen der weiß wie ich was umschreiben muss damits der ie6 auch anzeigt browserweiche undso bekomm ich ja selbser hin... nur ich weiß nich was der ie6 da falsch interpretiert und wie ich des behebe -
Erstmal heisst es immer noch STANDARD... keinen interessiert die Art wie du stehst!
so auf Anhieb würde ich dir raten, in der Browserweiche den padding-top von .nav_m in den Minusbereich zu legen... geht wohl am schnellsten
allerdings würde ich erstmal den margin überall auf 0px setzen -
da muss ich meinem Vorredner recht geben!
Auszug aus http://www.drweb.de/csstechnik/css-strukturieren.shtml
Abstände aller Elemente werden auf Null gesetzt + weitere Formatierungen
html, body, div, p, h1, h2, h3, ul, ol,
span, a, table, td, form, img, li {
margin: 0;
padding: 0;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}
Erklärung:
Alle Innen- und Außenabstände werden auf null gesetzt. Damit ist die Arbeit übersichtlicher und ich habe mehr Kontrolle die Abstände, da diese jetzt einzeln gesetzt werden müssen.
Weiters gebe ich auch hier meist eine Schrift für alle Elemente an und spare mir Zeit und Code. -
Nachtrag:
Ich habe es zusätzlich mit Avant Browser getested und ich glaube der liegt auf IE6 Basis, aber ich weiss nciht ob sichs änder wenn man IE7 drauf hat.
Nun im Avant wird alles richtig dargestellt, wie im Mozilla, Firefox, IE7 und Opera9 -
Stimmt, das Ganze mit Avant zu testen ist recht sinnlos.
Aber du kannst für IE6 ein extra CSS definieren (alle Sachen die überschireben werden sollen, musst du mit " !important" vor dem ";" abschließen):
also einfach im <head>:
<!--[if IE 6]>
dann den Link zur CSS-Datei
<![endif]-->
einfügen.
kk
nur wat soll ich da nun ändern weil die lösung mit padding in minusbereich isses ja auch nich so finde ich...
aber was meint ihr mit margin üerall auf null setzen? des is doch garnich nötig, da der doch standartmäßig 0 is und nur wenn ich was anderes angebe eben geändert wird oder seh ich des falsch?
aber danke schonmal! -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
