Mozilla Optimierung - was mach ich falsch?

[Maquita]

Hallöchen!

Da ich selbst nur noch mit Mozilla unterwegs bin, wollt ich nu endlich mal die kleinen Darstellungsfehler meiner Portfolio Seite ausbessern...
Ich weiß nu aber nicht so recht, woran's liegt...

Das erste was nicht angezeigt wird sind die gepunkteten Linien...hier ist das Problem, dass der IE das ja freiwillig auch net macht und ich deshalb mit einem Bild tricksen musste...der Code dazu im Stylesheet sieht so aus:

.hr {
	margin: 0;
	padding: 0;
	border-bottom: 1px dotted #8E9118;
	width: 360px;
	height: 1px;
}

* html .hr {
	border-bottom: none;
	padding: 1px;
	background: url(images/dotted.gif) repeat-x bottom;	
}

Das versteht Mozilla halt offenbar net...ich hätt aber dort trotzdem gerne auch Linien...die können auch gestrichelt sein, hauptsache überhaupt Linien....kann man da was machen?

Außerdem stimmen die Abstände des öfteren mal nicht...direkt auf der News Seite z. B. das // Neue Links ist total unter News gequetscht (oder auch unter Kontakt "zum Gästebuch"), im IE siehts aber richtig aus...der Code:

<br>
<h1>News</h1>
<b class="headline_small">[title]</b><br>
<span>[date]</span>
<p></p>

Im IE hab ich nach einem H1 einen rießen Abstand....

Und dann wird mein Fade-in Script (in der Navigation) nicht angezeigt in Mozilla...das Script findet ihr hier
Hat jemand eine Idee woran das liegen könnte?

Wäre für jede Hilfe dankbar!

[renkert.net]

Erstmal zu Deinen Dotlines:

Lass mal dei <hr> Tag außen vor und definiere folgende .class in Deiner Stylesheet Datei:

.dotline1
{
background: url("dotted.gif") repeat-x;
height: 1px;
font-size: 0;
margin: 5px 0 0 0;
padding: 0;
}

Mit Hilfe der margin Definitionen kannst Du festlegen wie sich Inhalte, die vor und nach der Linie erscheinen verhalten sollen, Abstandtechnisch.

Wenn DU nun die Linie einfügen willst, setzt an der beliebigen Stelle einfach folgenden Code ein:

<div class="dotline1"></div>

Nochwas: Dein Gif hat die Masse 3px breit und 2px hoxh, mach es mal 1 px hoch, das reicht und passt dann auch zu obiger CSS Definition.

Wenn Du andere Linien benötigst definier einfach weitere classen als dotline2, dotline 3 usw. Ob das mit der Fontsize rein muss weiss ich nicht, ich hab das einfach mal so aus meiner eigenen Seite rauskopiert....

Ich hoffe dass das auch in Deinem Tabellenlayout funktioniert....in reinem Css Layout gehts einwandfrei

[renkert.net]

Nun zu Deinen Abstandsproblemen:

Ich schlage vor, Du ordnest erstmal sauber Deine CSS Anweisungen, wnn die dann OK sind, dann kann man Probleme analysieren. Das sie nicht Ok sind, zeigt folgender Link:

http://jigsaw.w3.org/css-validator/v...er.diary-x.com

[paul123]

Hier gibts auch noch paar Infos zu hr-definitionen http://www.css4you.de/trickkiste/tr00007.html

Warum machst du für deine hr eine Klasse wenn du hr gleich definieren kannst? Gestrichelte Linien funktionieren bei mir problemlos...

[renkert.net]

...weil Du grundsätzlich mit .id´s und classes arbeiten solltest...aber das ist Geschmackssache.

Hatte übrigens den Link vergessen wo Du Dir die Linien anschauen kannst:

http://www.boxmaxx.com

[paul123]

<ot>

...weil Du grundsätzlich mit .id´s und classes arbeiten solltest...

war das auf meinen post bezogen? Das versteh ich nicht. Wenn ich eine hr (als Bsp.) überall gleich einsetze mit gleicher def. warum soll ich diese dann nicht direkt auszeichnen. warum dafür ne extra class schreiben, was ja auch im code wieder mehr aufwand bedeutet...

Also, ich kenn das nur so (angelesenes Wissen). Aber wenn du das belegen kannst, bin gern aufgeschlossen, da ich gern dazulerne.

</ot>

[renkert.net]

Klar kannst Du das machen, die Welt ist rund, ich persönlich habe aber gerne die Möglichkeit verschiedene Elemente gleicher Art zu definieren und mittels Javascript darauf zuzugreifen...und da steur ich nunmal einfacher eine ID an oder mehrere Elemente mit gleicher Class...


....der Satz ging übrigens weiter mit ...aber das ist Geschmackssache....

[Maquita]

Dankeschön! Hab's eben erst gelesen! Werd das gleich mal ausprobieren!

[Maquita]

Okay, da is ja fast alles falsch...Dreamweaver unterstreicht mir da auch immer jede Menge, aber ich kann da nicht so ganz folgen...

Wieso ist das hier zum Beispiel alles falsch?

body {
	align: center;
		background-attachment: fixed;
scrollbar-face-color: #A6E4F1;
scrollbar-highlight-color: #ffffff;
scrollbar-3dlight-color: #DAF4FA;
scrollbar-darkshadow-color: #0D6577;
scrollbar-shadow-color: #1B99B3;
scrollbar-arrow-color: #29BFDE;
scrollbar-track-color: #E4F7FB;
cursor: url(images/cursor.cur);

Wo soll das denn sonst hin?

[paul123]

Wo soll das denn sonst hin?

meinst du wegen dem validator? Einfach verstecken ... also die scrollbar..
http://www.traum-projekt.com/forum/s...ad.php?t=40722

[renkert.net]

Weil Deine ganze Seite fast ausschließlich für IE optimiert ist, die Scrollbar Settings funzen nicht in MOZ, auch Deine JS Funktionen mit dem Blend Effekt gehen nicht in MOZ, genauso wie das Cursor Ding.

Ich denke mal Dreamweaver mault, weil die Scrollbar Dinger nicht laufen...oder?

[Maquita]

Zitat von renkert.net

Weil Deine ganze Seite fast ausschließlich für IE optimiert ist, die Scrollbar Settings funzen nicht in MOZ, auch Deine JS Funktionen mit dem Blend Effekt gehen nicht in MOZ, genauso wie das Cursor Ding.

Ich denke mal Dreamweaver mault, weil die Scrollbar Dinger nicht laufen...oder?

Das weiß ich alles, dass das in Mozilla net geht, damit kann ich leben, nur mit den oben angegeben Dingen eben net....
Das mit der Scrollbar is mir total schnuppe, aber die Abstände stimmen halt net und die gepunktete Linie...alles andere macht nix!
Das mit der Linie hab ich noch net probiert, ich weiß jetzt nur nicht, warum die Abstände in Mozilla anders sind als in IE...

[renkert.net]

Liebe Nicole, die unterschiedlichen Abstände können 1000 Gründe haben. Um das genau zu analysieren, muss Dein CSS Code aber einigermassen valide sein, sonst sucht man sich tot.

Schau Dir das mal an und bestaune die Fehlermeldungen:

http://jigsaw.w3.org/css-validator/v...usermedium=all

Wenn Du die CSS validiert hast (font-weight: none gibst nicht, Schriften mit Leerzeichen stehen immer in "", also "Century Gothic", usw...) dann schauen wir uns das nochmal an und dann findet sich das Problem auch....


Grüssel aus S