Navbar
jeannie61
- css
- javascript
Guten Morgen, ich habe versucht meine Übungen zu modernisieren mit der neue Hot Potatoes Programme. Alle meine Übungen sind mit die ältere Programmen gebaut worden. Auf der Link oben habe ich es geschafft alles zu machen damit es funktioniert auf meine Seite aber das Navbar stimmt nicht. Ich weiß, wenn ich <style> rausnehme, dann stimmt es aber dann verliere ich die Farben. Kann mir eine bitte helfen dieses Problem zu lösen? Viele lieben Dank, Jeannie
Servus!
Guten Morgen, ich habe versucht meine Übungen zu modernisieren mit der neue Hot Potatoes Programme. Alle meine Übungen sind mit die ältere Programmen gebaut worden. Auf der Link oben habe ich es geschafft alles zu machen damit es funktioniert auf meine Seite aber das Navbar stimmt nicht.
Die navbar ist mit 11.5em Breite breiter als die Tabellenzelle.
Grundproblem ist das Tabellenlayout der gesamten Seite.
Zum Lesen: HTML/Tutorials/responsive_Webdesign/bestehende_Webseiten_umbauen
Herzliche Grüße
Matthias Scharwies
Danke für die Antwort :-) Hier auf alle anderen Seiten geht es https://school-english.de/english/uebungen/uebungen.html
Servus!
Danke für die Antwort :-) Hier auf alle anderen Seiten geht es
Entweder Du nimmst eine funktionierende Seite und baust Den Inhalt dieser Seite dort ein.
Oder Du schaust, was man ändern könnte / sollte müsste:
Irgendetwas haut mit der Zeichenkodierung nicht hin:
Du verwendest windows-1252, es sollte aber laut header charset=iso-8859-1 sein. Besser ist es alles in utf-8 zu machen.
Wenigstens lädst Du mit JavaScript ein Menü für schmale Viewports!
Ich würde als ersten Schritte alle Tabellenelemente Deiner Webseite löschen. Dann hättest Du nur wenige Elemente, die du mit CSS positionieren kannst:
<body>
<header>
<img src="https://school-english.de/mainimages/logo1.png" alt="Englisch Übungen">
<nav>
<ul>
<li><a href="https://school-english.de/english/uebungen/uebungen.html">Exercises</a></li>
<li><a href="https://school-english.de/english/grammatik/grammatik.html">Grammar</a></li>
<li><a href="https://school-english.de/english/hoerverstehen/comprehension.html">Listening</a></li>
...
</ul>
</nav>
<div id="social">
....
</div>
</header>
<main>
...
</main>
</body>
Ich persönlich glaube, dass das neue Hot-Potatoes Probleme macht.
Herzliche Grüße
Matthias Scharwies
Hallo Matthias Scharwies,
Ich persönlich glaube, dass das neue Hot-Potatoes Probleme macht.
Die Seite hat zwei <html>
-Tags, zwei <head>
-Tags, zwei versciedene Angaben zur Zeichencodierung.
Bis demnächst
Matthias
Servus!
Hallo Matthias Scharwies,
Ich persönlich glaube, dass das neue Hot-Potatoes Probleme macht.
Die Seite hat zwei
<html>
-Tags, zwei<head>
-Tags, zwei versciedene Angaben zur Zeichencodierung.
Ja!
@jeannie61 Öffne Deine Seite mal im Firefox mit Rechtsklick. Alles was Du rot siehst, ist falsch!
Herzliche Grüße
Matthias Scharwies
Lieber Matthias und Matthias ja, das mit den beiden Header und so wüsste ich schon, aber ich werde alles was Rot ist erstmal rausnehmen. Vielen Dank erstmal.
"Du verwendest windows-1252, es sollte aber laut header charset=iso-8859-1 sein. Besser ist es alles in utf-8 zu machen."
Meinst du in den Mobil App? Eigentlich arbeite ich alle Seiten als Utf-8 oder meinst du ausgerechnet diese eine Seite?
Also in großen und ganzen, glaube ich zu verstehen, dass der Hot Potatoes ein Fehler drin hat?
Vielen lieben Dank, Jeannie
Hallo jeannie61,
Also in großen und ganzen, glaube ich zu verstehen, dass der Hot Potatoes ein Fehler drin hat?
Wahrscheinlich nicht, der Fehler entsteht erst durch den Zusammenbau.
Bis demnächst
Matthias
Servus!
Lieber Matthias und Matthias ja, das mit den beiden Header und so wüsste ich schon, aber ich werde alles was Rot ist erstmal rausnehmen. Vielen Dank erstmal.
Dann müsste die eine Seite zumindest so wie die anderen funktionieren.
"Du verwendest windows-1252, es sollte aber laut header charset=iso-8859-1 sein. Besser ist es alles in utf-8 zu machen."
Meinst du in den Mobil App? Eigentlich arbeite ich alle Seiten als Utf-8 oder meinst du ausgerechnet diese eine Seite?
Bis jetzt noch nicht:
<!DOCTYPE html>
<html lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" >
...
Also in großen und ganzen, glaube ich zu verstehen, dass der Hot Potatoes ein Fehler drin hat?
Anscheinend doch nicht, aber es ist auf jeden Fall schlechter Stil, alle Informationen (JS und CSS) im HTML-Dokument zu haben. Gute Quiz-Programme, z.b. das R-Quiz von @Felix Riesterer lagern die Stylesheets und die JS-Scripte aus, sodass sie vom Browser gecacht werden.
Eine weitere gute, moderne Alternative ist H5P
Herzliche Grüße
Matthias Scharwies
Hi Matthias,
<!DOCTYPE html>
<html lang="de"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" >
Ja, das ist von HotPotatoes aber nur auf diese Seite, soweit ich weiß...
@ Matthias S
@jeannie61 Öffne Deine Seite mal im Firefox mit Rechtsklick. Alles was Du rot siehst, ist falsch!
Das habe ich öfters gesehen. Kann ich grundsätzlich alles rausnehmen was rot ist? Viele Grüße Jeannie
Servus!
@ Matthias S
@jeannie61 Öffne Deine Seite mal im Firefox mit Rechtsklick. Alles was Du rot siehst, ist falsch!
Das habe ich öfters gesehen. Kann ich grundsätzlich alles rausnehmen was rot ist?
Ja, eigentlich schon. Und dann testen. Oft sind es einfach nur Textabsätze (<p>) oder Zeilenumbrüche (<br>).
Langfristig würde ich aber weg von den Tabellen!
Viele Grüße Jeannie
Herzliche Grüße
Matthias Scharwies
Hallo Ihr Beiden, ich habe das Problem gelöst erstmal mit der Navbar - es war sehr einfach;-) https://school-english.de/english/uebungen/simple_present/simpres1a.htm
Viele Grüße Jeannie
Hallo Matthias,
Du verwendest windows-1252, es sollte aber laut header charset=iso-8859-1 sein.
ISO 8859-1 ist eine Untermenge von Windows-1252; letzteres belegt die Codes 0x80..9F, die in der ISO-Codierung reserviert sind, mit druckbaren Zeichen. Eine Verwechslung dieser beiden Codierungen würde daher in der Praxis kaum auffallen.
Der Screenshot sieht eher danach aus, als würde dort UTF-8 verwendet, dem Browser aber als ISO-8859-x verkauft. Dann werden aus einem Umlaut, der in UTF-8 mit zwei Bytes codiert wird, plötzlich zwei komische Zeichen.
Besser ist es alles in utf-8 zu machen.
ACK.
Live long and pros healthy,
Martin