Nachrichtenarchiv-Menü-Archiv

**BerndDaniel** · 23.01.2011, 20:09

Hallo,
ich habe mal zwei Screenshots gemacht, vom Menü links lt. Angaben in Peter Müllers Buch; ... einmal so wie es sein soll, einmal, so, wie ich es hinbekommen habe, obwohl ich sämtliche .css aus der beiliegenden Buch-DVD übernommen habe.
Bilder sind im Anhang; ...

Was habe ich übersehen?

**neueplaneten** · 23.01.2011, 20:12

Hats du vielmehr eine Link, damit man sich das mit Firebug ansehen kann?

**BerndDaniel** · 23.01.2011, 20:22

ja,
natürlich; ... aber nicht wundern, ich teste noch.
Hier der Link.

**neueplaneten** · 23.01.2011, 22:12

Code:

@media screen{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
caption,th,td{text-align:left;vertical-align:top;}
abbr,acronym{border-bottom:1px dotted #666;font-variant:normal;cursor:help;}
/*Teil gekürzt*/

Da liegt schon das Problem, normal muss es so aussehen

Code:

@media screen{
* {margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
caption,th,td{text-align:left;vertical-align:top;}
abbr,acronym{border-bottom:1px dotted #666;font-variant:normal;cursor:help;}
/*Teil gekürzt*/
}

Wahrscheinlich hat er beim Import das Sternchen ignoriert und dann auch noch die geschwungene Klammer. Damit wird das Reset aller Elemente nicht vollzogen. Somit bleibt das <ul> mit dem default Innenabstand erhalten. Die Listenelemente werden so einegrückt, weil <ul> nen Innenabstand hat.

Lösung:

Lösche die basic-1.css, lege eine neue reset.css an, stell sie auf media all und binde sie im Seitenlayout an oberster Stelle ein, also so, dass sie als erstes geladen wird. Damit setzt Du alle Browser auf 0, sprich ein Reset. Dann legst du eine typo.css an, stellst auf projection,screen und setzt sie an 2. Stelle im Seitenlayout anch dem Reset.

reset.css muss als erste geladen werden.

Code:

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,samp,small,strike,strong,sub,sup,dl,dt,dd,ol,ul,li,fieldset{margin:0;padding:0;vertical-align:baseline;border:0;font-family:inherit;font-size:100%;outline: 0;font-weight: inherit;font-style: inherit;}
:focus{outline: 0;}
body{line-height:1;color: black;background: white;overflow-y:scroll;}
ol,ul{list-style: none;}
table{border-collapse:separate;border-spacing: 0;}
caption,th,td{text-align:left;font-weight:normal;}
blockquote:before,blockquote:after,q:before,q:after{content: "";}
blockquote,q{quotes: "" "";}

typo.css Farben bitte anpassen

Code:

html{font-size:75%;}
html>body{font-size:12px;}
body{font-family:Tahoma, Arial, Verdana, sans-serif;color:#444;font-size:1em;line-height:1.5em;}
p,td,th,li,form,code,pre{margin:1.5em 0;}
h1{margin:0 0 0.75em;font-weight:bold;font-size:2em;line-height:1em;}
h2{margin:0.83em 0;font-size:1.83em;line-height:1em;}
h3{margin:0.9em 0;font-size:1.67em;line-height:0.9em;}
h4{margin:1em 0;font-size:1.5em;line-height:1em;}
h5{margin:1.13em 0;font-size:1.33em;line-height:1.13em;}
h6{margin:1.29em 0;font-size:1.17em;line-height:1.29em;}
ul,ol,dl{margin:0 0 1.6667em 1em;padding:0;}
ul{list-style-style:disc;}
ul ul{margin-bottom:0;list-style-type:square;}
ol{list-style-type:decimal;}
ol ol{margin-bottom:0;list-style-type:lower-latin;}
li{margin:0 0 0 0.8em;line-height:1.9em;}
dt{font-weight:bold;}
dd{margin:0 0 1em 0.8em;}
strong{font-weight:bold;}
em{font-style:italic;}
sub,sup{font-size:91.6667%;line-height:0;}
sup{vertical-align:text-top;}
sub{vertical-align:text-bottom;}
blockquote{margin:0;}
blockquote p{padding-left:30px;font-family:Georgia, "Times New Roman", Times, serif;font-style:italic;font-size:1.33em;color:#222;line-height:1.5em;}
a{color:#0d699e;}
a:hover{text-decoration:none;}
table{margin:0;padding:0;border-collapse:collapse;border:none;}
th{padding:10px 5px;text-align:center;border:1px solid #4D8FB2;font-size:14px;color:#FFFFFF;background:#085781;text-transform: uppercase;}
th a{color:#fff;}
td{padding:5px;text-align:left;border:1px solid #bfbfbf;background:#fafafa;}
tfoot td{font-weight:bold;background:#DFDFDF;}

Das eine setz alles auf 0, das andere gibt die passende Formatierung.

Viel Erfolg.