nicht angemeldet
Box-Model-Bug :-(
Hi,
ich habe noch nicht aufgegeben und möchte meine Homepage nach wie vor per CSS formatieren, statt wie sonst auf Tabellen zurückzugreifen. Soweit, so gut. Dabei ist mir der doofe Box-Model-Bug des IE im Wege.
Egal was ich mache, ich kriege es nicht hin, dass die Ebenen im IE und im Netscape die gleiche Position haben. :-(
Anzusehen ist das ganze unter http://www.bens-homepage.de/neu/index3.php.
Als erstes habe ich einen <div>-Bereich, der den obersten Teil enthält (Verlauf mit Logo). Darunter folgt ein <div> mit dem grünen Balken (enthält hinterher das interne Menü). Dieser Bereich hat die Klasse "menu_oben". Als nächstes folgt dann der <div> für das Menü. Dieses hat die Klasse "menu". Das Problem ist, dass die Bereiche im Netscape alle um 1 oder 2 Pixel nach rechts verschoben sind.
Hier die Klassen:
body { margin: 0px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9pt;
background-image:url(../gfx/back.gif);
background-repeat:repeat-y;
background-position:center;
background-color: #7CA57D;
text-align: center; }
.menu_oben { width: 786px;
height: 15px;
background-color: #3B4F3C;
color: #FFFFFF;
padding-right: 10px;
padding-top: 1px;
font-size: 7.5pt;
position: relative;
top: -2px;
text-align: right;
margin-left:auto;
margin-right:auto; }
.menu { padding-left: 10px;
font-size: 8.5pt;
width: 134px;
position: relative;
top: -2px;
left: -327px;
text-align: left;
background-image:url(../gfx/menu_head.jpg);
background-repeat:no-repeat;
background-position:top;
padding-top: 60px;
margin-left:auto;
margin-right:auto; }
Bitte helft mir. Ich bin langsam am Verzweifeln... *seufz* :-(
Danke und liebe Grüße
Ben
-
Anzusehen ist das ganze unter http://www.bens-homepage.de/neu/index3.php.
Als erstes habe ich einen <div>-Bereich, der den obersten Teil enthält (Verlauf mit Logo). Darunter folgt ein <div> mit dem grünen Balken (enthält hinterher das interne Menü). Dieser Bereich hat die Klasse "menu_oben". Als nächstes folgt dann der <div> für das Menü. Dieses hat die Klasse "menu". Das Problem ist, dass die Bereiche im Netscape alle um 1 oder 2 Pixel nach rechts verschoben sind.
Deine Struktur hast du schön beschrieben, aber nicht so gut umgesetzt.
.menu_oben { width: 786px;
height: 15px;
background-color: #3B4F3C;
color: #FFFFFF;
padding-right: 10px;
padding-top: 1px;
font-size: 7.5pt;
position: relative;
top: -2px;
text-align: right;
margin-left:auto;
margin-right:auto; }font-size:7.5pt AAAAAAAAAAAAAAAAAAAAAAAHHHHH
http://www.netandmore.de/faq/fom-serve/cache/1153.htmleinerseits willst du diese Elemente zentrieren (margin:auto) anderseits positionieren, ja was denn nun? (7.5 pt dürften auf dem Mac ca. 3px sein)
.menu { padding-left: 10px;
font-size: 8.5pt;
width: 134px;
position: relative;
top: -2px;
left: -327px;
text-align: left;
background-image:url(../gfx/menu_head.jpg);
background-repeat:no-repeat;
background-position:top;
padding-top: 60px;
margin-left:auto;
margin-right:auto; }Bitte helft mir. Ich bin langsam am Verzweifeln... *seufz* :-(
Sieht man deinem code auch an, du solltest nur das einbauen, was du wirklich brauchst. Mir sieht es danach aus, als ob du einfach immer mehr eingebaut hast ohne wirklich zu Wissen warum und wunderst dich jetzt dass es nicht so ist wie du dir es wünscht.
Struppi.
-
Hi Struppi,
font-size:7.5pt AAAAAAAAAAAAAAAAAAAAAAAHHHHH
http://www.netandmore.de/faq/fom-serve/cache/1153.htmlMan möge mir verzeihen. Ich bin jung und brauche das Geld. :-)
einerseits willst du diese Elemente zentrieren (margin:auto) anderseits positionieren, ja was denn nun? (7.5 pt dürften auf dem Mac ca. 3px sein)
nunja, die Seite an sich soll zentriert sein, die einzelnen Elemente ja aber nicht. Ich glaube, ich war gestern nach einigen Stunden mit diesem dummen Bug vollkommen durcheinander...
Sieht man deinem code auch an, du solltest nur das einbauen, was du wirklich brauchst. Mir sieht es danach aus, als ob du einfach immer mehr eingebaut hast ohne wirklich zu Wissen warum und wunderst dich jetzt dass es nicht so ist wie du dir es wünscht.
Ich werde es mir heute nach der Arbeit mal ganz in Ruhe ansehen und hoffentlich zum richtigen Ergebnis kommen. Drück mir die Daumen...
Danke und Gruß
Ben-
nunja, die Seite an sich soll zentriert sein, die einzelnen Elemente ja aber nicht. Ich glaube, ich war gestern nach einigen Stunden mit diesem dummen Bug vollkommen durcheinander...
Nicht das ich dir nicht helfen will, es ist aber für eine komplette Seite sehr aufwendig (wie du gemerkt hast) sich mit CSS Deklarationen zu beschäftigen. Es ist einfacher dir bei einzelnen Problemen zu helfen, als bei der ganzen Seite.
Deshalb zuerst das zentrieren Problem.
Um den kompletten Inhalt zu zentrieren brauchst du nur dem body entweder ein margin oder padding zu geben.
body
{
margin-left:10%;
margin-right:10%;
}Schwupps ist die Seite zentriert.
Da du aber dummerweise die fixe Breite deines Logos brauchst (das hier auf einem 15" Zöller nicht in den Browser paßt), musst du erst in deiner Seite ein Div einbauen, das den entsprechenden Platz bietet:
<body>
<div id="content">
</div>
</body>und dass muss um ALLES drumherum.
CSS:
#content
{
width:XXXXpx;
margin:auto;
padding:0
}usw.
Struppi.
-
Hi Struppi,
Nicht das ich dir nicht helfen will, es ist aber für eine komplette Seite sehr aufwendig (wie du gemerkt hast) sich mit CSS Deklarationen zu beschäftigen. Es ist einfacher dir bei einzelnen Problemen zu helfen, als bei der ganzen Seite.
Das habe ich auch nicht gedacht. Ich glaube, ich war gestern nach dem ganzen hin und her so durcheinander, dass ich nur noch Müll fabriziert habe. Ich werde heute einmal ganz von vorne beginnen und es hoffentlich wesentlich besser strukturiert hinbekommen. Für deine Ansätze danke ich dir auf jeden Fall schonmal. Ich poste dann heute Abend, wenn ich eine konkretere Frage habe nochmal und hoffe dann wieder auf tatkräftige Unterstützung. :-)
Gruß
BenPS: Warum will ich bei deinem Namen eigentlich ständig diesen blöden Flachwitz machen und fragen, wo Tim ist? :-)
-
PS: Warum will ich bei deinem Namen eigentlich ständig diesen blöden Flachwitz machen und fragen, wo Tim ist? :-)
keine Ahnung - einfaches Gemüt? ;-)
Struppi.
-
Hi,
keine Ahnung - einfaches Gemüt? ;-)
Nun, das mag wohl sein *gg*
Gemütliche Grüße
Ben ;-) -
Hallo,
PS: Warum will ich bei deinem Namen eigentlich ständig diesen blöden
Flachwitz machen und fragen, wo Tim ist? :-)
keine Ahnung - einfaches Gemüt? ;-)Halte ich für sehr wahrscheinlich. ;-)
Tim
-
-
-
-
-