CSS nach löschen von Kommentaren ändert sich Formatierung

4miranda · 12. März 2013

Hallo,
hab nach 10 Jahren jetzt mal wieder angefangen, was zu basteln und nach diesem Muster
(http://de.selfhtml.org/css/layouts/anzeige/nav_modern.htm)
mir auf meiner Homepage eine waagerechte Nav.zeile eingebaut.
Alles lief einwandfrei bis ich im style-Bereich eine Kommentarzeile gelöscht habe ().
Wird in Phase5 ja grünlich dargestellt. Nach dem Löschen war die Formatierung verschoben, u.a. das Menü senkrecht. Getestet in aktuellen FF und IE.
Bisher dachte ich, dass Kommentare keine Auswirkungen haben, und nun das.

Wollte mal anfragen, ob das so o.k. ist oder ob es eine Macke vom Programm ist.

Miranda

Nachtrag: ich verwende keine Frames oder Tabellen, nur # und div usw.

Kausalat · 12. März 2013

Wie immer wäre der Quellcode hilfreich, um dir helfen zu können.

Mit großer Sicherheit gibt es irgendwo im CSS- oder HTML-Quelltext einen klitzekleinen Tippfehler, der die Zuordnung der CSS-Formatierung verhindert.

Der HTML- und der CSS-Validator sind übrigens nette Helfer, wenn es darum geht, Quelltextfehler aufzuspüren.

Polii · 12. März 2013

In CSS wird mit /* text */ auskommentiert.

edit: Ja, Quelltext wär noch praktisch.

4miranda · 12. März 2013

auf Zeile 311 im Validator (Seitenquelltext) ist genau so ein Hinweis, den ich auch so eingegeben habe.
Der darf doch nichts verändern.
Damit habe ich auch bei der Erstellung immer mal wieder einige Programmabschnitte "ausgeblendet".

/* text */ ist mir schon bekannt gewesen.

Angehängt auch mal die Datei. Geht sicher professioneller zu machen, aber ich freu mich schon.
Wo ist die Datei??

Ergänzung (12. März 2013)

hier die Datei
Anhang anzeigen Homepage - Kopie (2).txt

Kausalat · 12. März 2013

Da gibt es noch ordentlich Nachholbedarf, was die Validität bei dir angeht. Für den Anfang ist dein Quellcode allerdings passabel. Da habe ich schon härtere Fälle erlebt

.

— der <body>-Tag sollte da stehen, wo deine Seite wirklich anfängt, sprich nach dem </head> und vor dem ersten HTML-Element
— du verwendest IDs doppelt
— du benutzt veraltete Formatierungen wie alink, vlink etc.
— du benutzt HTML-5-Elemente wie <footer>, obwohl dein Dokument als XHTML deklariert ist
— du missbrauchst <p>-Tags als Abstadshalter und schließt diese nicht einmal mit einem </p>
— es finden sich darüber hinaus zahlreiche Tippfehler und verwaiste Elemente wie z. B. ein einsames <a>

Polii · 12. März 2013

Wieso packst du die CSS Formatierung nicht in eine separate Datei? Das macht dir das Leben schon mal wesentlich einfacher.

Kannst du mal lgenau sagen welcher Kommentar denn nun Probleme verursacht?

4miranda · 12. März 2013

Anhang anzeigen Homepage - Kopie-ohne.txt
hier habe ich die hellgrünen Bemerkungen mal rausgelöscht, sonst nichts geändert. Die Links stehen bei mir nun senkrecht.

Die navigation habe ich komplett im head, weil die bei jeder Folgeseite erscheinen sollen. So hab ich im body nur den Teil, der geändert wird.
Oder kann man Teile des body (hier Navigation und Grundaufbau der Seite) ggf. auch in eine gesonderte Datei abspeichern?
xxxx.css mache ich, wenn alles stimmig ist.
Vielen Dank für die Fehlerhinweise.

Miranda

Kausalat · 12. März 2013

Du verstehst offenbar nicht, wie ein HTML-Dokument richtig strukturiert ist. Bevor du zig falsch codierte HTML-Dateien erstellst, solltest du dir wirklich einmal die nötigen Grundlagen aneignen. Ansonsten ergibt dein Vorhaben einfach keinen Sinn.

In den <head>-Bereich kommen nur Meta-Tags, Stylesheets und andere Verweise (z. B. Javascript) — kein Seiteninhalt!

Erst im <body>-Bereich kannst du dich richtig austoben, denn dort kommt alles hinein, das der Nutzer tatsächlich im Browserfenster sieht.

---

Wenn du leicht austauschbare Elemente wie die Navigation einfach in Folgeseiten einbinden willst, kommst du um eine Scriptsprache wie PHP nicht herum. Zu diesem Thema finden sich genauso wie für jedes andere Anliegen genug Anleitungen im Netz.

4miranda · 12. März 2013

AW: nach löschen von Kommentaren ändert sich Formatierung; CSS-Datei erstellt, aber

Möchte das hier noch mal aufgreifen.
Habe nun alles bereinigt und der Validierungsdienst sagt mir: ALLES OK!
Funktioniert auch alles.
Nun habe ich eine styles.css erzeugt und eingebunden mit
<link rel="stylesheet" type="text/css" href="styles.css">
Wenn ich jetzt die Seite aufrufe, fehlt beispielsweise das Hintergrundbild, das ich im body-Teil stehen habe:
body {
background: url(cheese.jpg);
font-family:Verdana, Arial, sans-serif;
font-size:12px;
}
Daneben ändern sich die Größen der Buttons. Das kann ich ja noch beheben.
Kann doch aber nicht sein, dass das Hintergrundbild nicht geladen wird. Alle anderen Bilder werden angezeigt.

Kausalat · 13. März 2013

Wo liegt denn deine CSS-Datei und wo die Grafik? Der Dateipfad zur Grafik muss je nach Speicherort in der CSS-Datei korrekt angegeben werden.

4miranda · 14. März 2013

wenn ich die styles innerhalbe der HP habe, wird alles angezeigt. Gliedere ich die Styles wie oben angegeben aus, wird der Bereich
body {
background-image: url(cheese.jpg);
font-family:Verdana;
font-size:8px;
}
innerhalb des styles überhaupt nicht verarbeitet.
HP,css und Backgroundimage liegen im gleichen Verzeichnis.
Habe mal den font von 12 auf 8 geändert. Wird bei extra-css nicht erkannt!! Also wird der gesamte body nicht erkannt. Woran kann das liegen?

Kausalat · 14. März 2013

Vielleicht hast du einfach keinen <body> in deinem HTML-Dokument? Oder sonst irgendwo einen Tippfehler? Auch hier wäre es hilfreich, wenn du dein Dokument hochladen könntest.

Alle gängigen Browser haben doch so schöne Entwicklerwerkzeuge, mit denen du jedes beliebige Element hinsichtlich seiner "Style-Vererbung" untersuchen kannst.

Wird z. B. die Schriftgröße font-size: 8px; rechts im Kasten durchgestrichen dargestellt, funkt irgendein anderes Stylesheet oder eine übergeordnete Browsereinstellung dazwischen.

Ist gar nichts von deiner Schriftgröße zu sehen, gibt es einen klaren Zuordnungsfehler (wenn z. B. der <body> fehlt oder sich unzulässige Kommentare in der CSS-Datei befinden etwa).

4miranda · 14. März 2013

Ich stelle hier nun folgende Dateien ein:
Homepage_incl_css (also 1 htm-Seite, in der die css-styles nicht ausgegliedert sind-hier klappt alles)
Homepage (hier ist aus o.g. Seite der Teil styles ausgegliedert- hier wird nicht alles richtig angezeigt)
styles (hier ist oben der Bereich body enthalten, der nicht von FF und IE verarbeitet wird)

Alle Dateien: HP, Hintergrundbild und css-Datei befinden sich im selben Verzeichnis.

Es kann eigentlich nur an der Ausgliederung liegen. Nur weiß ich beim besten Willen nicht, wo der Fehler liegt. Separate styles.css habe ich schon wiederholt erstellt, um Übertragungsfehler zu vermeiden.
Gearbeitet habe ich mit Phase5 und Notepad++

Anhang anzeigen Homepage.txt
Anhang anzeigen Homepage-_incl_css.txt
Anhang anzeigen styles.txt

Daaron · 14. März 2013

2 offensichtliche Fehler
1.) #navioben hast du 2x verwendet
2.) <link rel="stylesheet" type="text/css" href="styles.css"> <- Tag nicht geschlossen, führt sicher zu Fehlern

4miranda · 14. März 2013

verstehe ich nicht ganz:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Homepage</title>
<meta name="author" content="M"/>
<meta name="description" content="Homepage von "/>
<meta name="keywords" content="" />
<link rel="stylesheet" type="text/css" href="styles.css">
</head>

das > ist doch da oder muß es /> sein?

Daaron · 14. März 2013

/> ist Pflicht bei Link-Elementen.

Kausalat · 14. März 2013

Du hast quasi nichts von all dem, das ich dir in Beitrag #5 aufgezählt habe, korrigiert. Es sind immer noch doppelte IDs vorhanden, unnötige leere <a>-Tags, unnötige   ... neben Tonnen von Schreibfehlern.

In eine CSS-Datei gehört wirklich nur CSS! HTML-Tags wie <style type="text/css"> [...] </style> sind absolut fehl am Platz und werden von den Browsern wegen Nonkonformität bis zur nächsten halbwegs konformen Formatierung einfach übersprungen. Daher wird dein Stylesheet nicht richtig eingelesen.

Am fehlenden End-Tag /> liegt es in diesem Fall nicht.

Dass dein ganzes Konstrukt von den Validatoren abgenommen wird, halte ich für eine mehr als gewagte These.

Ich wiederhole mich nur ungern: Eigne dir vor dem Quelltextschreiben die nötigen Grundlagenkenntnisse an! Vermeide zudem banale Tippfehler wie fehlende Kommas bei font-family:Verdana Arial, sans-serif;.

4miranda · 14. März 2013

/> hab ich probiert, geht trotzdem nicht.

Ich will noch mal sagen: Der Widerspruch ist doch der, dass ALLES geht, wenn ich NICHT ausgegliedert habe.
Und nach Ausgliedern alles gefunden wird, nur nicht dieses blöde Anfangs-body. Das nervt mich mächtig.

Und wegen > habe ich mich nach mehrfach gefundener Schreibweise gerichtet, u.a. hier:
http://www.css-lernen.net/css-grundlagen.php

Möchte mich aber bedanken, dass ihr euch meinem kleinen Problem annehmt.

miranda

Ich glaube, ich habe jetzt die Lösung gefunden:

Biei der Erstellung der styles.css habe ich <style type="text/css"> am Anfang und </style> am Ende mit reingenommen. Nun habe ich beim Recherchieren gefunden, dass das nicht mit reingehört.
Rausgelöscht und alles geht.

Kann nur sagen: typischer Anfängerfehler (wird sicher nicht der letzte sein). Danke an alle, die mich beim Fehlerfinden unterstützt haben.

palace4d · 14. März 2013

Die Verwendung von /> oder > ist je nach Doctype unterschiedlich. In HTML5 geht beides, in XHTML muss die erste Schreibweise genommen werden.

Kausalat · 14. März 2013

4miranda schrieb:
Ich glaube, ich habe jetzt die Lösung gefunden:

Biei der Erstellung der styles.css habe ich <style type="text/css"> am Anfang und </style> am Ende mit reingenommen. Nun habe ich beim Recherchieren gefunden, dass das nicht mit reingehört.
Rausgelöscht und alles geht.

Was du nicht sagst! In diesem Fall hättest du auch einfach meinen Beitrag lesen können.

Wie auch immer, viel Erfolg noch beim Quelltextschreiben.

CSS nach löschen von Kommentaren ändert sich Formatierung

Ensign

Kausalat

Gast

Cadet 4th Year

Ensign

Kausalat

Gast

Cadet 4th Year

Ensign

Kausalat

Gast

Ensign

Kausalat

Gast

Ensign

Kausalat

Gast

Ensign

Fleet Admiral

Ensign

Fleet Admiral

Kausalat

Gast

Ensign

Lt. Commander

Kausalat

Gast

Ähnliche Themen