Doctype verändert meine Website - nur auf meinem Rechner

GoldSaver

Well-known member
ID: 399455
L
11 Juni 2010
5.749
28
Hallo,
ich habe einmal eine Frage zu meiner Website und dem Doctype, bzw. zu der Darstellung meiner Website.
Ich habe unter der Domain https://www.foto-retouche.de/ einen Fotoservice mit der Shop-Software SmartStore.biz 5 erstellt.
Ursprünglich war die linke Navigation 200 Pixel breit, was ich aber in den Design-Einstellungen mit SmartStore.biz auf 170 Pixel reduziert habe.
Die Navigation ganz oben habe ich so eingestellt, das alle 6 Buttons in eine Reihe passen. So wie es also im Moment auch zu sehen ist.

Ich lasse meine Seite mit professioneller Hilfe für Suchmaschinen optimieren und habe daher einige Änderungen nach dem Erstellen mit SmartStore.biz 5 vorgenommen.

Nach dem Erstellen der Website mit SmartStore.biz 5 habe ich alle Meta-Angaben etwas umgeändert, also am Ende ein / eingefügt.
Vorher Sahen alle Meta-Angaben so aus:
Code:
<meta http-equiv="language" content="de">
Und nun sehen sie so aus:
Code:
<meta http-equiv="language" content="de" />

Der Doctype war ursprünglich dieser:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

Nun steht auf der Startseite dieser Doctype:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml" dir="ltr" lang="de">

Und auf allen Unterseiten steht dieser Doctype:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>

Nach der Änderung des Doctypes wurden bei mir im Internet-Explorer 8 sowohl auf der Startseite als auch auf den Unterseiten die Buttons der oberen Navigation etwas breiter angezeigt. Die Navigation passte nicht mehr in eine Zeile.
Diesen Fehler konnte ich zum Glück über die entsprechende CSS-Datei korrigieren und dort habe ich die Buttons einfach verkleinert.

Mein Problem liegt allerdings bei der linken Navigation.
Bei mir gehen die Zwischenlinien der einzelnen Schaltflächen über die Navigation hinaus, bis in den Text. Es sieht so aus, als wären die Schaltflächen und damit auch die Zwischenlinien immer noch 200 Pixel breit, aber die Navigation ist nu 170 breit. Wenn man auf einen Button in der Navigation klickt sieht man auch deutlich die angeklickte Schaltfläche und diese ist größer als die Navigation selbst.
Es sieht also so aus:
ueberstehende_linien.jpg


Ich kann über die CSS-Datei auch die Navigation schmäler und breiter einstellen, aber die Schaltflächen und Zwischenlinien sind immer ein Stück größer als die Navigation selbst.

Komischerweise wird alles wieder richtig angezeigt, wenn ich den alten Doctype verwende.
Es sieht dann so aus:
keine_ueberstehende_linien.jpg


Was ich auch nicht verstehe ist, das es nur bei mir am PC so aussieht.
Wenn ich an einen anderen Rechner gehe, ist alles ganz normal, egal welcher Doctype verwendet wird.
Man kann auch verschiedene Browser verwenden.

Wie sieht meine Website bei euch aus?
Stehen die Schaltflächen über oder ist alles ganz normal?

Und kann mir da jemand weiterhelfen, warum es bei mir nicht korrekt dargestellt wird?

Danke.

Gruß,
GoldSaver
 
Kommt davon, wenn man sich an einem fehlerhaftem Browser orientiert :p

Das falsche Box-Modell wird nur vom IE praktiziert. Alle anderen Browser arbeiten gemäß den Standards.

Infos:
https://de.selfhtml.org/css/formate/box_modell.htm

Hallo,
danke für die schnelle Antwort.
Eins verstehe ich aber nicht: Ich verwende auf meinem Rechner InternetExplorer 8 und auf anderen Rechnern auch den InternetExplorer 8, aber der Fehler tritt nur bei meinem Rechner auf.
Oder kann es sein, das mir ein Update für den InernetExplorer 8 fehlt?

Gruß,
GoldSaver
 
Diese Frage kann ich dir leider nicht beantworten; ich benutze nämlich keinen IE ;)

Du kannst aber mal gucken, ob einer der beiden Browser irgendwelche Kompatibilitätsoptionen aktiviert hat und somit eingestellt ist, sich anders zu verhalten. Und die Versionsnummer mal überprüfen, ob es wirklich dieselben Browser sind.

Zum Entwicklen würde ich dir einen Firefox (ja...., oder natürlich Opera oder Chrome - wobei ich letzteren nicht wirklich mag) empfehlen. Nur zum Testen dann mal IE7, IE8 und IE9 ausprobieren.
 
Hal,
ja, trotzdem danke für die Hilfe.

Ich glaube aber nicht das es ein fehlendes Update ist, denn auf deiner Seite, wo du den Link gepostet hast, wird nur vom Internet-Explorer bis Version 6 gesprochen.
Aber ich werde es trotzdem mal überprüfen.

Noch eine Frage, die du mri eventuell beantworten kannst.
Ich habe ja die 3 verschiedenen Doctypen:
Der ursprünglich auf allen Seiten war:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html>

Der nun auf der Startseite ist:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="https://www.w3.org/1999/xhtml" dir="ltr" lang="de">

Und der nun auf allen Unterseiten steht:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html>

Ich verstehe nicht so ganz, warum nun auf der Startseite ein anderer Doctype mit XHTML steht und auf den Unterseiten der Doctype mit HTML steht.

Müsste es nicht bei beiden derselbe sein?

Also ich habe es selbst nicht geändert, sondern machen lassen, daher sollte es richtig sein, aber man weis ja nie...

Eine Erklärung wäre klasse.

Wenn du oder jeman anderes das wissen sollte.

Gruß,
GoldSaver
 
Müsste es nicht bei beiden derselbe sein?
Du kannst die eine Unterseite auf deutsch schreiben, die zweite Unterseite auf englisch und die dritte auf russisch. Genauso beim Doctype. Wie du willst.
Also ich habe es selbst nicht geändert, sondern machen lassen, daher sollte es richtig sein, aber man weis ja nie...

Eine Erklärung wäre klasse.

Wenn du oder jeman anderes das wissen sollte.
Ich kann dir nicht sagen, was jemand gemacht hat oder nicht gemacht hat, den du beauftragt hast. Hierzu entweder eine Wahrsagerin, ein Orakel oder einfach die betreffende Person befragen ;)

Ich weiß nur, aus einer elementaren Tatsache der Physik sagen, dass wenn niemand was verändert hat, es noch so is, wie vorher 8) ;)
 
Ist schon klar, das du nicht weist, was geändert wurde oder warum es geändert wurde, es ging mir auch nur ums allgemeine und das hast du ja beantwortet.

Ich hatte nämlich gedacht, das enteder alles mit dem einem oder dem anderem geschrieben sein muss. Aber wenn das unterschiedlich sein kann, ist es natürlich etwas anderes.

Danke schon mal dafür.

Ich werde nun érst einmal aller Updates aufspielen und schauen, ob der Fehler dann behoben ist, denn es könnte ja eventuell wirklich daran liegen, auch wenn bei deinem Link-Seite nur von Internet-Explorer bis Version 8 die Rede ist.

Ansonsten mal schauen, ob noch einer eine Idee hat oder ob ich so den Fehler finde.
 
Ich hatte nämlich gedacht, das enteder alles mit dem einem oder dem anderem geschrieben sein muss. Aber wenn das unterschiedlich sein kann, ist es natürlich etwas anderes.
Was is denn bei dir "alles"? Ein Client kann immer nur eine Resource anfordern - wenn auch mehrere hintereinander oder/und in einem Request - und jede Resource is von der anderen unabhängig. Deine Bilder, JavaScripts, Stylesheets, Applets, Mp3s, Videos und was es sonst auf einer Webseite zu downloaden gibt, hast du ja ganz normal und willst ihnen keinen Doctype verpassen, oder? :ugly:
 
Was is denn bei dir "alles"?
Damit meinte ich alle Seiten meiner Website, also die Index.htm, sowie die damit verknüpften Unterseiten.

Ein Client kann immer nur eine Resource anfordern - wenn auch mehrere hintereinander oder/und in einem Request - und jede Resource is von der anderen unabhängig. Deine Bilder, JavaScripts, Stylesheets, Applets, Mp3s, Videos und was es sonst auf einer Webseite zu downloaden gibt, hast du ja ganz normal und willst ihnen keinen Doctype verpassen, oder? :ugly:
Nein, natürlich will ich das nicht, ich meinte natürlich nur die HTML-Seiten meiner Website und nicht irgendwelche anderen Dateien oder Scripte.

Vielleicht ist es so etwas verständlicher, was ich mit meinem Satz "Ich dachte es müsste alles..." gemeint habe:
Die Website habe ich mit einer Shóp-Software erstellt, diese hat auf allen HTML-Seiten diesen Doctype verwendet:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html>

Die Metaangaben und die Links zu den Stylesheets waren alle in dieser Form geschrieben:
Code:
<meta http-equiv="language" content="de">

So nun wurde die Website bearbeitet und auf allen Seiten sehen die Metaangaben und die Links zu den Stylesheets so aus:
Code:
<meta http-equiv="language" content="de" />

Da diese Änderung sowohl auf der Index.htm, als auch auf den Unterseiten durchgeführt wurde, bin ich davon ausgegangen, das es dieselbe HTML-Version ist und somit auch auf allen Seiten derselbe Doctype stehen muss.
(Ich weis nicht, ob ich mit HTML-Version das korrekte Wort gewählt habe, hoffe aber du verstehst, was ich meine)

Allerdings steht nun auf der Index-Seite dieser Doctype:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="https://www.w3.org/1999/xhtml" dir="ltr" lang="de">

Und auf den Unterseiten wurde nur ein Wort des ursprünglichen Doctypes weggelassen:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"><html>

Ich bin nun davon ausgegangen, das man auf allen Seiten einen XHTML- oder auf allen Seiten einen HTML-Doctype verwenden müsste.
Schließlich wurden die Metaangaben und Links zu den Stylesheets auf allen Seiten umgeschrieben, warum ist aber nun nur der Doctype der ersten Seite mit XHTML geschrieben?
Das war es, was ich nicht verstanden hatte.
Aber wenn auch eine HTML-Seite mit Metaangaben geschrieben werden die mit " /> enden, dann ist es für mich verständlich.
Ich dachte wenn es mit " /> wäre es XHTML.

Das einzigste was ich am falschem Box-Modell nur noch nicht so ganz verstehe ist, warum diesem stehen nur die einzelnen Buttons über die Tabelle hinaus, so dass man die Zwischenlinien sieht.
Und auch wenn ich die Spalte breiter oder schmäler mache, stehen sie immer ein Stück über.

Ich habe nun eine Einstellung in einer meiner CSS-Dateien gefunden, mit der ich die Buttons verkleinern konnte, so dass sie genau in die Spalte passen.
Dazu möchte ich aber noch etwas fragen:
Ich habe die Spalte auf eine Breite von 170 Pixel eingestellt.
Die eben genannte Einstellung für die Breite der Buttons stand auf 100%.
Nun dacht ich zuerst, ich müsse dort einfach 170 Pixel eintragen, was aber nicht geklappt hat.
Die Buttons passen erst in die Spalte, wenn ich dort einen noch kleineren Wert, nämlich 153 Pixel eintrage.

Somit werden die Buttons mit 153 Pixel und die Spalte mit 170 Pixel genau gleich groß dargestellt. Hat dieser Box-Fehler also dann damit zu tun das vorher die Buttons auf 100% gestellt waren und soll ich die Buttons nun auf 153 Pixel eingestellt lassen oder ist es besser wenn ich dort eine Prozentangabe eintrage?
Ich habe es ausgetestet, entweder die 153 Pixel oder 90%, beides funktioniert.

Was ist für verschiedene Browser besser geeignet?
Falls es einen Unterschied gibt, denn ich habe nun beide Varianten - Buttonbreite mit 153 Pixel und mit 90% - bei mir am PC und auf den anderem Rechner getestet, wo der Fehler von vornherein nicht sichtbar war.

Beide Varianten klappen, wowohl bei mir als auch auf den Rechner, wo der Box-Fehler nicht aufgetreten ist.

Also denke ich, das es egal ist, was ich schreibe.
Oder nicht?

Danke jedenfalls für die Hilfe, so konnte ich nun doch den Fehler finden.

Gruß,
GoldSaver
 
Aber wenn auch eine HTML-Seite mit Metaangaben geschrieben werden die mit " /> enden, dann ist es für mich verständlich.
Ich dachte wenn es mit " /> wäre es XHTML.
Hä?
HTML-Tags dürfen nicht mit /> geschlossen werden.
XHTML-Tags müssen mit /> geschlossen werden.

Kontrollier halt selber mal, welche Fehler du hast:
https://validator.w3.org/check?verb...to-retouche.de/digitale-fotoartikel/index.htm
https://validator.w3.org/check?verbose=1&uri=http://www.foto-retouche.de/
 
Hallo,
danke das du mir das nochmals bestätigt.
Dann habe ich doch Recht, was ich mir so selbst an Infos üner HTML angeeignet habe.

Allerdings bin ich nun maßlos enttäuscht von meiner Hilfe, die das besarbeitet.
Vor allem es ist kein Freundschaftsdienst oder so, sondern es ist eine große Firma, die ich damit beauftragt habe /den Namen will ich lieber mal nicht nennen).
Jedenfalls bekommen die nun erst einmal ganz schön zu hören, denn schließlich bezahle ich sie dafür.
Und danke für deine Seite, da war ich mal drauf, bevor ich den Auftrag zu Bearbeitung gegeben habe. Eigentlich wurde mir versichert, das nun alle Fehler behoben wurden!

Danke, das hilft mir weiter, ich werde mich nun darum kümmern, wollte jedoch vorher Gewissheit, das ich im Recht bin.

Gruß,
GoldSaver
 
Ich habe nun eine Einstellung in einer meiner CSS-Dateien gefunden, mit der ich die Buttons verkleinern konnte, so dass sie genau in die Spalte passen.
Dazu möchte ich aber noch etwas fragen:
Ich habe die Spalte auf eine Breite von 170 Pixel eingestellt.
Die eben genannte Einstellung für die Breite der Buttons stand auf 100%.
Nun dacht ich zuerst, ich müsse dort einfach 170 Pixel eintragen, was aber nicht geklappt hat.
Die Buttons passen erst in die Spalte, wenn ich dort einen noch kleineren Wert, nämlich 153 Pixel eintrage.

Somit werden die Buttons mit 153 Pixel und die Spalte mit 170 Pixel genau gleich groß dargestellt. Hat dieser Box-Fehler also dann damit zu tun das vorher die Buttons auf 100% gestellt waren und soll ich die Buttons nun auf 153 Pixel eingestellt lassen oder ist es besser wenn ich dort eine Prozentangabe eintrage?
Ich habe es ausgetestet, entweder die 153 Pixel oder 90%, beides funktioniert.
Die Breite einer Box errechnet sich auf zwei unterschiedliche Arten. Beim korrekten Boxmodel gilt: Gesamtbreite = Margin + Border + Padding + Inhalt. Mit width kann aber nur der Inhalt bestimmt werden.
Beim fehlerhaften Boxmodel gilt: Gesamtbreite = width.

Bei dir gibt es auf den Links ein ein Padding von 15px und 3px. Also musst du diese Größen von width abziehen. Ergo müsste die korrrekte Breite 170-15-3 = 152 lauten.

HTH