|
CSS - Mozilla
Vorgabe: 3 gleich breite, zentriert dargestellte Flächen im CSS-Code:
<html> <head> <style type="text/css"> body { background-color:#E0E0E0; text-align: center; } .ft { font-family: verdana,arial,sans-serif; font-size:10px; font-color: #A0A0A0; } #kasten1 { position: static; height: 100px; width: 800px; margin: auto; padding: 15px; padding-top: 35px; background-color: #C0C0C0; text-align: left; } #kasten2 { position: static; height: 500px; width: 800px; margin: auto; padding: 15px; background-color: #C4C4C4; text-align: left; } #menu { position: static; height: 200px; width: 800px; margin: auto; background-color: orange; text-align: left; } </style> </head> <body> <div id="kasten1"> <span class="ft">hallo</span> </div> <div id="menu">wewe</div> <div id="kasten2"></div> </body> </html> Ergebnis: ich bekomme 3 gleich breite Flächen (IE & Mozilla) Wenn ich in #menu die Höhe auf 20px reduziere, zeigt IE alles korrekt an, Mozilla verschmälert die Breite. Woran liegt's. |
Wie möchten relative Angaben verwenden und einen Validator nutzen
pong |
Bei relativen Angaben hätt ich dann noch eine Frage, dazu später. Wenn ich die static Anweisung rausnehme, funktionierts auch nicht.
Was passt sonst nicht, hab das aus einem Buch übernommen. |
Zitat:
Mozilla zeigt es korrekt an (wenn wir uns darauf einigen können, dass mit "korrekt" entsprechend des W3C Standards gemeint ist) Das Problem wird hier beschrieben: http://css4you.de/wsboxmodell/index.html#browser Es geht darum, ob "padding" in "width" enthalten ist oder nicht. mfg c. |
Zitat:
|
Gut, wenn ich die padding-Eigenschaft rausnehme, gehts. Sieht aber nicht wirklich hübsch aus, wenn alles am Rand pickt.
|
Zitat:
http://www.css-technik.de/details/70/9/CSS-Snippets.htm pong |
Danke vorerst für die Links, werde mich mal weiterspielen:D
|
Du kannst 2 DIVs ineinander verschachteln und beim inneren "margin" einstellen.
|
Also, ich will ja nicht nerven, aber warum sieht das im IE (auch wenns falsch sein sollte ;) ) richtig im Sinne "so will ich's" und im Modzilla nicht?
diese Seite |
Zitat:
pong |
Ähm?
|
Zitat:
c. |
Stimmt, ich fang gerade an und hab da ein Problem. Anstatt einer Hilfe bekomm ich da dubiose Verschwörungstheorien als Antwort.
"Wieso macht die Regierung alles zur Vergraulung der zahlenden Bevölkerung, obwohl sie von diesem überhaupt erst in die Lage gebracht wurden?.... Ganz einfach, sie halten sich nicht an die allgemein erwünschten Spielregeln" Das ergibt überhaupt keinen Sinn, "von diesem" wer soll damit gemeint sein? "..., sie halten sich.." wieso Plural? Liegt's vielleicht doch nicht nur an mir oder siezt man sich hier ? Das alles lässt mehreren Interpretationen zu = wenig hilfreich. Wenn es so leicht ist, den Fehler zu finden, ja warum schreibt man das nicht rein, ich dachte, das sei hier ein Forum, wo man Fragen stellt und klare Antworten bekommt. |
Es gibt Standards von W3C. Diese werden von Browsern mal eingehalten, mal nicht.
Wenn du einer Spalte, einem Div, egal was eine Width gibts und auch ein Padding gibts (zb. width 100px, padding 20px) wird bei einem browser die spalte/.. 120px breit weil width und padding zusammengerechnet werden, anderswo wiederum bleibts bei 100px. Laut W3C wäre das ganze mit 120px korrekt, nur der IE machts genau verkehrt. (soweit ich das in Erinnerung hab). mfg Thomas |
Mich würde interessieren, warum bei meiner Übungsseite im Modzilla die "bottom"-Zeile hinaufrutscht (resp. die restlichen Boxen hinausfallen).
Strukturiert sieht das so aus: Ein zentrierter "container", der folgende Boxen in sich aufnimmt: "banner" "box1", "box2" nebeneinander (float:left) "bottom" Hab schon einige komplizierter Seiten in CSS gesehen, kann doch nicht sein, dass ausgerechnet mein einfaches 0815-Design den Browsern Schwierigkeiten macht, ich hab halt irgendwo einen Fehler drin, den ich nicht finde. Für'n Profi sollte das doch ein Klax sein. |
Könntest du vl. ein Beispiel online stellen? Damit tut man sich leichter...
mfg Thomas |
diese Seite
der zweite graue Balken sollte unter den beiden nebeneinanderstehenden Boxen erscheinen, orange ist der container-Rahmen, der sollte alles einrahmen. (Im IE sieht es richtig aus, in Modzilla nicht) |
Du hast da die divs für box1, box2 und bottom hintereinander stehen.
box2 hat auch ein float left, deshalb wird von opera versucht des div bottom auch daneben anzuzeigen, da kommt er dann aber mit der Breite durcheinander und es kommt wieder mal irgendwas raus. Lösch mal von box2 das float:left raus, dann funktionierts zumindest bei mir in Opera. mfg Thomas |
Passt, danke!
Hab da ein Buch neben mir liegen, wo fast (aber eben nur fast) das gleiche Layout verwendet wird, und der verwendet für zwei Spalten nebeneinander zwei "float"-Befehle. Auf jeden Fall nochmals ein großes DANKE für deine Mühe! |
Zitat:
gruss, snowman |
Es schaut trotzdem noch in jedem Browser anders aus.
Mein Vorschlag: http://www.456bereastreet.com/lab/de...slayout/2-col/ Da sieht man auch schön, warum viele Webagenturen noch Tabellen verwenden, diese Entwicklungszeit zahlen viele Kunden nicht. gruss, snowman |
@snowman
Bei den ganzen Ausnahmen weiß ich scho selber nicht mehr, welche Browserversion was falsch oder richtig oder wie auch immer macht ;) Sorry für die Falschmeldung... Danke für die Bestätigung, dass nicht alle tagelang mit DIVs herumprobieren, wenns nicht 100% funktioniert. mfg Thomas |
Zitat:
mfg c. |
| Alle Zeitangaben in WEZ +2. Es ist jetzt 00:49 Uhr. |
Powered by vBulletin® Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
© 2009 FSL Verlag