[XHTML/CSS] Tabellen- >CSS-Design

[LasMiranda]

Ich habe die Seite www.saechsischer-heimatschutz.de versucht so gut wie nur möglich in ein ordentliches CSS-Design "umzuwandeln" - ist allerdings noch nicht ganz fertig.
Mein Ergebnis sieht im Moment so aus: https://mc-dd.de/lsh/

Das mit der Breite soll so sein; finde ich persönlich besser also 100%.

So, nun meine Fragen/Probleme:
1.
Ich habe links in den Menüs angegeben, dass der ein Bild in die List einbinden soll - anstelle der komischen Knubbel. Komischerweise wird nichts angezeigt.

list-style-image:url(linkicon-gruen.gif);

das steht in der objekte.css.
Soll angeblich im IE und Fx gehen. Siehe https://de.selfhtml.org/css/eigenschaften/listen.htm#list_style_image
Ich habe keine Ahnung warum
2. Kann ich den Code eventuell noch weiter optimieren? Er ist zwar 100% valid und es kommen auch keine Fehler in der Fehlerkonsole (im Fx), aber vielleicht habe ich dumme Sachen reingeschrieben, die total unnütz sind

EDIT: hmm, jetzt seh ich grad auf w3, dass das Ding gar nicht valid ist. Voll auf die Extension verlassen, Mist

 

[tleilax]

Sorry, nicht persönlich oder böse gemeint, aber:

Der Fehler in Problem 1 ist so doof, dass Du Dir gleich bestimmt auch vorn Kopp haust.

Ein transparentes grünes Icon auf einem Hintergrund derselben Farbe wird immer so aussehen, als wäre es nicht da. Mach den Hintergrund mal schwarz oder so, dann wird's Dir auch auffallen.

Zu Deinem zweiten Punkt:

Das einzige, was mir grad so aufgefallen ist, ist das hier:

 margin:0 0 0 0;

Da reicht die zusammengefasste Angabe:

margin: 0;

 

[theHacker]

2. Kann ich den Code eventuell noch weiter optimieren?

So wie der Code jetzt aussieht, kannst du sogar XHTML 1.0 Strict verwenden

Was ich vielleicht noch machen würde, ist, die <br />s rauszunehmen und durch entsprechende margin-Angaben zu ersetzen.

Und, was mir noch aufgefallen is, dein Stylesheet etwas schöner gestalten: Einheitlich entweder Leerzeichen nach dem Doppelpunkt oder nicht, wobei ich persönlich lieber ein Leerzeichen mehr drin hab und auch Leerzeilen zwischen verschiedenen Bereich einbaue. Der Traffic macht dich nicht arm, aber der Code ist gleich viel lesbarer.
Guck dir als Beispiel mal das Stylesheet von meiner Webseite an.

EDIT: hmm, jetzt seh ich grad auf w3, dass das Ding gar nicht valid ist. Voll auf die Extension verlassen, Mist

Ja, die Extension zeigt zwar nur richtige Fehler an, zeigt aber nicht 100% der Fehler an. Also immer nochmal den w3c-Validator drüber lassen.

 

[perlini]

2. Kann ich den Code eventuell noch weiter optimieren?

Zum css/html:

- div-Blöcken (z.B. #kopf oder #menulinks) brauch man nicht explizit 'display:block' sagen

- statt 'background-color' tut's auch ein einfaches 'background'

- für Überschriften gibt's die Elemente h1, h2, h3 usw. Man kann sich also '<span id="das_ist_eine_ueberschrift">Überschrift</span> sparen und statt dessen <h1>Landesverein Sächsichscher....</h1> und <h2>Anerkannter Naturschutzverb....</h2 verwenden

- da die 3 Menü-ul fast identisch sind, würd ich mir die ids schenken und die identischen Angaben in '#menulinks ul' schreiben und die Höhenangabe für die mittlere List direkt über 'style="..."' ins ul schreiben.

- statt 'list-style-image' düfte auch einfach 'list' reichen, bin mir aber nicht so sicher.

 

[theHacker]

- statt 'background-color' tut's auch ein einfaches 'background'

- statt 'list-style-image' düfte auch einfach 'list' reichen, bin mir aber nicht so sicher.

Unvorteilhaft

background enthält alle Eigenschaften von background-color, background-image, background-position, background-repeat und background-attachment.
Eine etwaige Vererbung würde damit überschrieben werden.

Bei list-style (nicht list ) entsprechend.

 

[perlini]

Eine etwaige Vererbung würde damit überschrieben werden.

Die gibbet's abba nich.

 

[theHacker]

Die gibbet's abba nich.

Aber warum soll ich deshalb was hinschreiben, was es gar nicht gibt ?
Auch wenn es in diesem Fall keine Konsequenzen hat, ist es unnötig, fünf (bei background) bzw. drei (bei list-style) Eigenschaften zu setzen, wenn nur eine einzige geändert werden muss.

 

[Dreamworker]

menulinks
menulinksgewaehlt
menu_links_oben

einheitlich bleiben entweder mit oder ohne unterstrich. ich persönlich finde unterstriche schrecklich und nutze daher lieber bindestriche

das mit den headlines wurde ja schon angesprochen.

<span id="ueberschrift_header_oben">

oh das tut jedem guten sauberen x(html) codeschreiber weh!

 

[perlini]

Aber warum soll ich deshalb was hinschreiben, was es gar nicht gibt ?
Auch wenn es in diesem Fall keine Konsequenzen hat, ist es unnötig, fünf (bei background) bzw. drei (bei list-style) Eigenschaften zu setzen, wenn nur eine einzige geändert werden muss.

Versteh ich jetzt nicht. Ich definiere doch mit 'background:#fff;' nur die HG-Farbe. (s. auch Erläuterung bei https://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background)