Gunnar Bittersmann: Dropdownmenü automatisch erweitern lassen.

Beitrag lesen

@@Beer

index.html:

<!DOCTYPE html>
<html lang="en" dir="ltr">

Hier ist schon dein erster Fehler: deine Seite ist auf Deutsch, du gibst aber fälschlicherweise Englisch an. Richtig ist lang="de".

dir="ltr" ist nicht falsch, aber überflüssig, da default.

<body style="font-family: Arial">

Die Angabe der Schrift gehört ins Stylesheet.

Und WARUM denn bitte Arial?

„[Arial] wird genommen, weil sie im Computermenü … ganz oben steht. Würde sie Zarial heißen, hätte sie kein Mensch genommen.“ — Erik Spiekermann

Arial ist keine besonders gut lesbare Schrift (und nein, Helvetica auch nicht).

    <footer>
        <div style="padding: 2px">Bei Fragen oder Anmerkungen bitte an .... wenden.</div>
    </footer>

    <div style="text-align: right;font-family: arial">Created by C....</div>
</body>

Dito, die Stilangaben gehören ins Stylesheet. Wozu die 2px Padding da überhaupt gut sein sollen, erschließt sich mir nicht.

Die Angabe „Created by C....“ gehört mit ins footer-Element.

Und warum auf Englisch? Und wenn auf Englisch, muss der Sprachwechsel angegeben werden: <div lang="en">.

Und warum div? Da wird nichts gruppiert. Für Textabsätze ist das p-Element vorgesehen.

menu.js:

<p>

    <header>

header darf nicht in p sein. Browser korrigieren den Fehler und schließen das p-Element. (Das End-Tag </p> am Ende des Scripts erzeugt ein weiteres leeres p-Element.) Weg mit den <p>/</p>-Tags!

        <h1 style="color:rgb(0, 0, 0);font-family:Arial;font-size:25px;text-align: left;margin-left: 25px">

Stilangaben gehören … – ach, das weißt du ja inzwischen.

Warum rgb(0, 0, 0) und nicht einfach (und lesbar) black? Und warum gibts du das überhaupt an, wo das doch default ist? Ebenso text-align: left.

Warum gibst du font-family an, wo sich die Schriftart gar nicht ändert? Dass Arial keine gute Schrift ist, sagte ich schon? Es kann nicht oft genug gesagt werden.

Und im Stylesheet sollte auch nicht px auftauchen. Gib Schriftgrößen, Abstände etc. relativ zur Basis-Schriftgröße an, d.h. in em bzw. rem.

            <img  alt=Logo witdh=80 height=80 src="./Logo.png">&nbsp; &nbsp; &nbsp; &nbsp;Überschrift</h1>        

Abstände mit CSS, nicht mit einer wilden Folge von &nbsp;!

Und am Ende sollte da auch ein sinnvollerer Alternativtext stehen als „Logo“, logo.

<!--Sidebar-Menü-->

<div class="wrapper">
            <nav>

Das div gruppiert nichts, kann weg. Du kannst stattdessen das nav-Element stylen.

🖖 Живіть довго і процвітайте

--
When the power of love overcomes the love of power the world will know peace.
— Jimi Hendrix