Responsive Dropdown Menü Navigation (nur mit CSS) Tutorial Deutsch
HTML-код
- Опубликовано: 5 июн 2024
- Hol dir bei Hostinger das beste Webhosting, um deine Webseite online zu stellen: www.hostinger.de/kurzundknapp
Mit dem Coupon-Code: KURZUNDKNAPP
sparst du 10% Rabatt auf alle Webhosting-Pakete mit einer Laufzeit von 12 Monaten und mehr.
Hi, den Source Code gibt es auf unserer Webseite:
👉 coding-kurzundknapp.com
In diesem Video wirst du lernen, wie du ein responsives Dropdown Menü erstellst und das ganze nur mit HTML und CSS.
Wir erstellen dabei eine Navigationsleiste mit Logo, Menüpunkten und Dropdown. Wir erstellen außerdem eine dropdown-mobile-variante, bei der die Links untereinander angeordnet werden.
Timestamps:
00:00 Endprodukt
00:29 HTML
01:52 CSS
06:34 Responsive
Folgenden CSS-Konzepte werden erklärt:
- hover-effect
- media-query
- Umgang mit Checkboxen
- Flexbox: ( • CSS Flexbox in 5 Minut... )
- CSS-Variablen: ( • CSS Variablen Tutorial... )
Tags für den Algorithmus:
css dropdown menu, dropdown, dropdown in css erstellen, navbar, responsive dropdown, responsive menu in css, css responsive navbar, navigationbar, navigationsleiste, css tutorial deutsch, dropdown mobile, mobile navbar, toggle button, hamburger menü, dreichstriche menü, mobile first, handy ansicht, handy navigation in css, smartphone navigation, media query mobile, css mobile view, @media, @media-query
Code:
Document
mycompany
Home
Products
Ebooks
Courses
Apps
About
Login
-----------------------------------------------------------------------------------------
:root{
--background-color: #314453;
--darker-background-color: #243848;
--accent-color: #41DCE1;
--text-color: #FFFFFF;
--navbar-height: 80px;
}
*{
margin: 0;
padding: 0;
font-size: 22px;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
color: var(--text-color);
}
html{
height: 100%;
}
body{
height: 100%;
}
nav{
height: var(--navbar-height);
background-color: var(--background-color);
display: flex;
justify-content: space-between;
align-items: center;
}
nav .logo{
margin-left: 30px;
font-family: Arial, Helvetica, sans-serif;
font-size: 35px;
font-variant: small-caps;
text-decoration: none;
}
nav ul{
height: 100%;
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
list-style: none;
}
nav li{
height: 100%;
width: 150px;
text-align: center;
position: relative;
}
nav li:hover{
background: var(--accent-color);
}
nav ul a{
height: 100%;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
text-decoration: none;
}
.dropdown{
height: min-content;
width: 200px;
background: var(--background-color);
display: none;
flex-direction: column;
position: absolute;
left: 0;
top: var(--navbar-height);
}
.dropdown li{
height: 70px;
width: 100%;
}
.dropdown li a{
justify-content: flex-start;
padding-left: 30px;
width: calc(100% - 30px);
}
nav li:hover .dropdown{
display: flex;
}
nav input[type="checkbox"]{
display: none;
}
.expandable_li{
display: flex;
justify-content: center;
align-items: center;
}
.toggle_button{
width: 30px;
height: 23px;
position: absolute;
top: 25px;
right: 25px;
display: none;
flex-direction: column;
justify-content: space-between;
}
.bar{
height: 4px;
width: 100%;
background: var(--text-color);
border-radius: 100px;
}
@media(max-width: 850px){
.toggle_button{
display: flex;
}
nav ul{
height: min-content;
width: 100%;
background-color: var(--background-color);
display: none;
position: absolute;
top: var(--navbar-height);
}
nav li{
height: min-content;
width: 100%;
}
nav ul a{
padding: 30px 0;
}
.expandable_li{
display: block;
}
.expandable_li label{
padding: 30px 0;
cursor: pointer;
display: block;
}
.expandable_li:hover .dropdown{
display: none;
}
.expandable_li input[type="checkbox"]:checked ~ .dropdown{
display: block;
}
.dropdown{
position: static;
width: 100%;
}
.dropdown li{
padding: 0;
display: block;
position: static;
background: var(--darker-background-color);
}
.dropdown li a{
width: 100%;
padding: 0;
justify-content: center;
}
#toggle_button:checked ~ ul{
display: block;
}
}
Das ist wirklich CSS Oberliga. Viel zu lernen und zu verstehen für mich. Danke für das Tutorial.. wird direkt mal nachgebastelt 👍
Genial, kurz, knackig und voll mit Info's, die auch noch verständlich erklärt werden. 👍
Das Turtorial ist mit abstand das beste zu dem Thema. Ich danke Dir für das Video und deiner Erklärung. Mach weiter so...😀
Kurz und knapp, ohne viel Schnickschnack mit dem Fokus aufs Wesentliche. Klasse!
Hervorragendes Tutorial!
Vielen Dank!
Königliches Video + Erklärung, einfach top
Echt gut gemacht. Um deiner Sprache hinterherzukommen brauchte ich zwar 0,75 Geschwindigkeit und bei deiner Geschwindigkeit zum Mittippen 0,5. aber zum Glück kann man ja runterregeln. Weiter so.
Dieses Video hat mir AMTLICH weitergeholfen :)
Sehr cooles Tutorial! Hat alles geklappt.
Konnte es durch die tolle, einfache Struktur super verwenden und einen (Mega) Dropdown MenüPunkt einbauen.
:root werde ich jetzt immer für fixe Farben und Höhen verwenden. Thankxxx.
Gut gemacht! hat mir sehr weiter geholfen, vor allem weil ich Flex nicht verstanden habe! 👑
Cool. Das ihr abkürzende Schreibweisen benutzt hat einen einen weiteren Lerneffekt nebenbei.
Top! Vielen Dank für dein Video!
Super erklärt und bringt mich zudem was ich derzeit brauche. Zudem wird auch das mit dem Drop-down erklärt und wie man es auch für Smartphones programmieren kann, erklärt. Findet man nicht überall. Die css variablen sind neu für mich und werden jetzt im Projekt implementiert. Vielen Dank und weiter so mit qualitativ hochwertigen content mit deutscher Sprache 😅
Super Video! Vielen Dank ;)
Bin erst jetzt auf euren Kanal gestoßen. Toll erklärt. Vielen Dank. Das beste was ich bisher gefunden habe. Einen kleinen Vorschlag habe ich noch, da der User in der mobilen Ansicht ja nicht weiß, dass er klicken kann um das Submenü aufzurufen. Ein kleines Chevron (˅) oder Dreieck (▾) hinter dem Wort "Products" löst das. Könnte man für das PC-Menü auch ausblenden.
sehr gutes Video
Ich fande es sehr interessant. Abo hast du.
Freut mich, danke!
Es wäre mega, wenn du immer deinen Quellcode mitgeben könntest ;)
Ansonsten weiter so und gerne mehr zu HTML&CSS gerade in Verbindung mit JavaScript
sehr cooles Tutorial und tolle Tips,
besonders var(--navbar-height) zu definieren und bei nav Höhe und zum Abstand / top für nav li zu nutzen hat mir sehr gefallen.
Wäre das gleiche für das padding bei nav ul a und .expardable li sinnvoll oder spricht etwas dagegen?
Vielen Dank und bestimmt nicht das letzte Video was ich von Dir schaue :D
Vielen Dank! Gute Idee. Dadurch, dass das padding in beiden Fällen gleich sein soll, ist es auf jeden Fall sinnvoll.
@Jeremy Slichcin Du musst lediglich eine neue Variable erstellen und auf gleiche Weise einsetzen.
unter root: --navbar-padding-left: 10px; sowie im weiteren CSS mit var(--navbar-padding-left); verwenden.
tnx bro
absolut genial, vielen dank dafür. das gibt mir einiges an wissen. Ich habe noch versucht das Hamburger Icon so gestalten, dass es beim anklicken zu einem x wird. bin allerdings kläglich gescheitert. hast du dazu noch eine möglichkeit?
Die Höhe für das und Element sollte man nicht auf 100 Prozent setzen, da diese so nicht mehr mit dem Inhalt wachsen und abgeschnitten werden. Eine Höhe für das Element ist überflüssig, da ohnehin nur der Inhalt des im Viewport des Browsers angezeigt wird. Weise dem und Element einfach mal eine unterschiedliche "border" zu, füge dann Inhalte in den ein (z.B. ) und schau dir an, welche Auswirkung die "fixe" Höhe von 100 Prozent hat. Verwende daher besser anstelle von "height" ein "min-height" und nutze "vh" (viewport-height) als Einheit. Wobei bei einer Mindesthöhe auch die 100 Prozent genutzt werden können.
Dieser Moment wenn man das um 4:30 Nachts, bevor man schlafen geht, schaut und man denkt man hat unabsichtlich 300% Geschwindigkeit eingestellt. 🤣🤣 Trotzdem super erklärt. Vielen Dank.
4:19 Uhr hier😂
Sehr cooles Tutorial! Ich habe noch nie programmiert und wollte fragen in welchem programm du deinen code schreibst? Außerdem, hat wer diese NAvigation zufällig schon auf dobe Portfolio eingebaut?
Visual Studio Code
@@stdavid_ gibt es sowas ähnliches auch für Handys?
@@ichmega1238 Auf Tablets oder Handys kannst du nicht wirklich gut programmieren, aber notfalls geht noch „Koder Code Editor“. Vielleicht krieg man auch Visual Studio Code irgendwie zum Laufen, da es ja eine Webanwendung ist. Musst du mal im Internet gucken.
@@stdavid_ es hat bei mir mal mit visual studio code geklappt aber fand ich nicht gut aber danke für die Handy-Alternative
Hallo und vielen Dank für das Tutorial! Klasse! Ich habe das Menü nachgebaut und es funktioniert soweit. Jedoch auf einem iPad lässt sich das Dropdownmenü zwar öffnen, jedoch nicht wieder schließen - in der Desktopansicht. Am Pc und in der Mobile-Ansicht funktioniert Alles prima, aber auf dem iPad habe ich kein "hover". Was kann ich tun, damit die Checkboxen "unchecked" werden, wenn ich bspw. auf das Display des iPad tippe (praktisch in den Body hinein, außerhalb des Menüs). Momentan MUSS ich eine Auswahl im Dropdownmenü treffen, damit das Dropdownmenü auch wieder schließt.
Herzlichen Dank im voraus für Deine Hilfe!
Wollte fragen ob du den Quellcode auch als Datei hast (zum downloaden)
Kompetent. Einzige Kritik: zu schnell gesprochen und daher für die, die es anschauen, oft schlecht zu verstehen, so dass man's wiederholen muss. Didaktisch ist das nen minus, denn man macht ja Tutorials zur Lehre für andere. Plus ist dann jedoch der veröffentlichte Code, so kann man ihn in Ruhe anschauen. 👍
Danke für dein Feedback.
Danke für das super Video! Sieht ja echt nice aus, nur funzt bei mir das mit den Menu wenns Display klein ist (die drei Balken) leider nicht . Es verschwindet einfach komplett alles, und das obwohl ich sicherheitshalber den kompletten Code kopiert habe. Woran kann das liegen?
Moinsen!🙋🏻♂️
Kennst du vielleicht eine Lösung für das folgende Problem?
Undzwar hatte ich mit OceanWp und Elementor eine Onpage-Website gebaut.
Aber alles Rechtliche (Datenschutz, Impressum und Haftungsausschluss) hat seine eigene Seite bekommen.
Wenn ich beim Header wieder auf Startseite, Leistungen etc. klicke ändert sich oben NUR der Permalink,
Aber ich gelange nicht wieder auf die Startseite.
Es geht nur wenn man auf das Logo klickt.
Wie kann ich bspw. von der Datenschutz-Seite wieder zurück auf die Startseite kommen, ohne auf das Logo zu klicken?
Liebe Grüße,
Firat✌🏼
Das Dropdown menu funktioniert super jedoch habe ich ein Problem, unzwar würde ich es gerne wie einen Button benutzen den ich dann mit zb einer url verknüpfen kann damit ich darauf direkt weitergeleitet werden kann jedoch weiß ich nicht wie ich es hier verknüpfen soll ?
sehr gutes tutorial aber könnten sie bitte den html und css code anpinnen?
Sehr gutes Tutorial, das hat meinen Code nochmal ein bisschen aufgeräumt!
Jetzt hätte ich nur noch die Frage, ob und ggf. wie ich in der Lage bin, dass die Navbar (beim Scrollen) stets oben fixiert ist.
Soweit ich weiß, funktioniert eine fixed position aufgrund der Nutzung von Flexbox nicht...
Wenn du da eine Idee hättest, würdest du mir ordentlich weiterhelfen! :)
Danke für das Lob! Bei dei nav kannst du problemlos position: fixed; festlegen. Du solltest nur dann darauf achten, die width auf 100% zu setzen und den z-index hoch anlegen. Zum Beispiel 10.
Bei der nav also Folgendes hinzufügen:
nav{
position: fixed;
width: 100%;
z-index: 10;
}
Viel Erfolg!
Hey, sehr hilfreiches Tutorial! Funktioniert alles perfekt und sieht auch gut aus. Bei mir verschwindet aber leider der Kasten von der Checkbox nicht. Habe schon vieles ausprobiert, aber kann es einfach nicht fixen. Hast du eine Idee an was das liegen könnte?
Vielen Dank!
Bei 6:18 setze ich das Display aller checkboxen in der Nav auf none. Falls du das schon gemacht hast, könntest du in den Developer tools (element untersuchen) nachschauen, ob du das Display eventuell an einer anderen Stelle überschreibst.
@@coding-kurzundknapp Erst einmal vielen Dank für die Antwort. Ich habe das jetzt auch noch überprüft, aber irgendwie will es einfach nicht funktionieren... 🤔überschrieben wird auf jeden Fall nichts
Hab's jetzt gefixt. Habe im CSS Code #toggle_button auf "display:none" gesetzt. Weiß zwar nicht, ob das die beste Lösung ist, aber es funktioniert
Lehrreiches Video, aber könntest du evtl den Code in die Beschreibung packen zur Fehlehrsuche ? Bei mir funktionier nur die Hälfte haha
Hallo ich habe ein Problem, und zwar habe ich mehrere Dropdowns, wenn ich allerdings auf der Mobilen Version einen Link anklicke öffnet sich nicht das dazugehörige Dropdown, sondern immer das am obersten liegende. Wieso ist das so, und wie kann ich diesen "Fehler" beheben ?
Hi, das Problem liegt höchst wahrscheinlich bei den IDs der anderen Dropdown Lis. Das input mit der jeweiligen Checkbox muss in jedem Fall eine eigene einzigartige ID haben, damit das dazugehörige label auch auf jeden Fall auf die richtige Checkbox verweist. Wenn du das Dropdown Menü also kopiert hast, kann es sein, dass du vergessen hast, eigene IDs festzulegen. Somit verweist das for Attribut der labels immer auf dieselbe Checkbox. Nämlich auf die des ersten Dropdowns.
So würde das korrekt aussehen, wenn du mehrere Dropdowns haben möchtest:
Products
Ebooks
Courses
Apps
About
Ebooks
Courses
Apps
Wie du siehst, verweist hier beim About Label das for Attribut auf "about_check". Wenn das auf "products_check" verweisen würde, wäre damit die Checkbox des Products Lis gemeint. Dann tritt dein Problem auf.
Ich hoffe ich konnte dir weiterhelfen ;)
Ziehe ich direkt das Browserfenster kleiner, klappt alles mit responsive. Der kleine Hamburger kommt und alles ist gut. Wechsle ich aber mit Ctrl+Shift+M in den Chrome Entwicklertools in die Gerätesymbolleiste und simuliere dort die Ansicht bei verschiedenen Geräten, klappt es nicht mehr.
Beispielsweise ersteckt sich die Navbar dann nicht mehr über die ganze Seite, hat rechts einen weißen Balken und auch der Hamburger kommt nicht mehr. Verlasse ich diesen Modus und mache das alles wieder im normalen Browserfenster, klappt es. Wo könnte das Problem liegen?
Die Entwickler Tools zeigen das manchmal nicht richtig an. Was ich da manchmal mache ist folgendes: Mit STRG + Mausrad Scrollen. Dann kommt oben rechts ein kleines Popup, was dir zeigt wie viel Prozent Zoom grade da ist. In diesem Fenster einfach auf "Zurücksetzen" klicken. Das löst bei mir meistens die Anzeigefehler in den Entwickler Tools.
Welches Farbthema verwendest du für deinen Code?
Ich habe mir für Visual Studio Code die Extension "Material Theme" geholt und in den Settings unter Workbench -> Appearance -> Color Theme das "Material Theme Darker High Contrast" Farbthema ausgewählt.
Hey, ich kann bei der mobilen Ansicht dann nicht auf die Striche("expandable_li")klicken damit sich das Menü öffnet, hab das Video nochmal geschaut um meinen Fehler zu entdecken, aber übersehe etwas. Weiß jemand woran es liegen könnte?
Generell ein Top-Tutorial, danke für die Mühe! Jedoch addressiert es ein paar Probleme leider nicht bzw. finde ich als Anfänger die Lösung dafür nicht. 1) Die Breite der einzelnen li in der Nav-Leiste ist auf 150px festgelegt. Es wäre jetzt schön, wenn sich die Textgröße dieser Breite anpassen würde. 2) Das äußerste Dropdown wandert aus dem Bildschirm heraus. Wäre toll, wenn es sich entsprechend anpassen würde, sodass es nicht aus dem sichtbaren Bereich hinaus wandert. Vermutlich total einfache Problemchen, wäre für Hinweise dankbar.
Danke für dein Feedback. Hier ein paar Vorschläge für die beiden Probleme:
1) Du kannst statt "width: 150px" auch "min-width: 150px" festlegen. Auf die Weise sind die Lis mindestens 150px breit und werden breiter, wenn ihr Inhalt mehr Platz braucht. So muss man nicht die Textgröße anpassen. Außerdem solltest du dem expandable_li ein padding links und rechts geben, damit es besser aussieht.
2) Das äußerste Dropdown ist ja ein Kindelement des letzten Lis in der nav. Deshalb kannst du es mit "nav li:last-child .dropdown" ansprechen. Hier kannst du dann entweder die width anpassen oder den left Wert mit negativem Vorzeichen nach links verschieben (zum Beispiel left: -15px).
Ich hoffe ich konnte dir weiterhelfen ;)
@@coding-kurzundknapp Fantastisch, danke für die schnelle Antwort. Versuche ich direkt morgen umzusetzen.
By the way ... bin froh deine Tutorials gefunden zu haben. Habe .root und variables vorher sonst noch nirgends gesehen ... vermutlich waren die zu "basic" ... kA. Werde das aber ebenfalls direkt morgen umsetzen. Macht alles viel cleaner.
@@coding-kurzundknapp Hey nochmal! Das mit dem last child hat schon mal gut funktioniert, allerdings betrifft das Problem mit dem Bildschirmrand auch das vorletzte "child". Ich hatte gehofft es mit "nth child" addressieren zu können, aber das scheint nicht möglich oder ich habe es in ( ) falsch addressiert. Hatte dort das betreffende label eingetragen. Ansonsten sehe ich nur noch die Möglichkeit die Reihenfolge zu ändern :(
Sehr gutes Video, hat mir sehr viel geholfen. Eine Sache will aber einfach nicht gelingen. Und zwar möchte ich die Texte innerhalb der ausgeklappten Drops zentrieren, so wie in der Dropdownauswahl. Was muss ich in der CSS ändern?
Ich hab nun doch noch eine Lösung gefunden. Und zwar hab ich die
.dropdown li a wie folgt geändert:
justify-content: flex-start;
padding-left: 15px;
align-items: center;
justify-content: center;
width: calc(100% - 30px);
kannst du mir kurz sagen ob das so richtig war? optisch sind die Texte im ausgeklappten Dropdown mittig
@@timo3613 Ja, das hast du richtig gemacht. Mit justify-content: center; und align-items: center; kannst du den Inhalt eines Flex-elements zentrieren. Beachte aber, dass du das "justify-content: flex-start;" wieder weg machst. Es ist nicht zu empfehlen eine Eigenschaft zwei mal im selben Selektor zuzuordnen.
Grüße
@@coding-kurzundknapp ich habe nun ein weiteres Problem bezgl. der Farben. Meine background color ist blau. Meine Textfarbe fürs Navigationsleiste ist gelb. Die Textfarbe für die komplette Seite ist ebenfalls blau. Das Problem ist nun, dass die Textfarbe der Reiter, welche sich ausklappen lassen, ebenfalls blau sind. Der Rest stimmt. Wo muss ich ansetzen?
hat sich erledigt, habe das label hinzugefügt und bearbeitet 😀
Erst einmal Danke für deine Mühe. Aber wieso kann man den Code nicht einfach zum Download anbieten? Es ist ja super, wie du alles erklärst, aber am Ende würde ich gerne den funktionierenden Code haben, da man beim Mitschreiben einfach Fehler macht. Ich schaue das Video nun zum dritten Mal, aber habe immer irgendwo einen Fehler, den ich nicht ausfindig machen kann. Als Anfänger hat man es da schwer. Das ist echt mühsam!
Ich will den Code auch als Detei zum downloaden 😂🤣
Problem schon gelöst oder brauchst du noch Hilfe?
Könntest du ein video dazu machen, dass wenn man zb auf Product clickt das man auf die seite weitergeleitet wird?
Wenn du meinst auf deiner eigenen Website eine weitere Seite zu verlinken, dann musst du in demselben Ordner eine zweite .html Datei angeben (z.b.: "2_seite.html") dann verlinkst du in der Hauptseite den Link: Seite 2
wenn man ein zweites dropdown haben möchte
braucht man dazu eine zweite ul oder nicht?
Ja. Jedes Li, was ein dropdown haben soll, ist gleich aufgebaut:
1. input (mit type checkbox)
2. label (für die checkbox)
3. ul (mit class dropdown)
Bei 1:35 siehst du den Aufbau.
Die mobile Variante könnte man auch mit :focus machen start checkbox.
Leider läßt sich diese navigation auf Onepages nicht schließen,
also wenn ich auf einer OnePage einen Link benutze dann bleibt die navigation offen .
was muss ich tun damit das Menu schließt?
Hilfe ! ! !
Mein Togglebutton will nicht…
Die Bars werden angezeigt und die Checkpoints funktioniert (cursor verändert sich)
Mögliche Fehler/Probleme:
Das nav liegt in einem header. Der header hat einen niedrigeren z-Index zugewiesen als das nav.
Habe versucht dem tugglebutton auch einen z Index zu geben, hilft aber nicht …
Danke
Hallo. Meine Navigation ist links angeheftet, warum nicht rechts? Also das erste Item, About ist links direkt nebem dem Logo... Warum das?
Wenn ich mehrere Dropdown habe, wie bekomme ich es hin, dass, wenn ich in der mobilen Version ein Dropdown öffne, die anderen dabei schließen?
Auch wenn man das Hamburger erneut anklickt, wie kann man alle Einstellungen wieder auf 0 setzen, sodass es beim erneuten anklicken nicht mit den zuvor geöffneten Dropdown startet?
Digger geiles Tutorial, aber wie schon beim letzten Mal, hast du vergessen, die Funktion auszuführen, wenn man auf die Links klickt, dass das Drop-Down-Menü danach geschlossen wird. Ich hab das damals mit Java gelöst, aber wie mache ich das hier?????
ich brauche dringend deine hilfe, komme alleine nicht weiter
@@kevinlobisch4924 hast du es geschafft !? habe dass selbe Problem
Moin, danke dir für das Klasse Video. Das war genau was ich suchte. Leider wird in der Mobil Version bei mir nicht das DropDown Menü angezeigt. Wirklich alles klappt aber eben das nicht. Ich hab nun 8x das ganze ab Minute 8 mit meinem Code verglichen. Könntest du mir helfen? Leider finde ich kein Impressum damit ich dir persönlich schreiben kann. Grüße
Hi, wenn du sagst, dass du den Code ab Minute 8 mehrfach abgeglichen hast, kann es sein, dass der Fehler vielleicht ganz am Anfang beim HTML-Teil liegt. Vielleicht ist da eine Kleinigkeit schiefgelaufen. Hier mal zwei Sachen, die du überprüfen solltest:
1. Das For-Attribut vom Products Label und die ID der Checkbox sollten auf jeden Fall übereinstimmen, damit die Checkbox gecheckt werden kann. Das ist notwendig, um das dropdown ein- und auszuschalten.
2. Das Dropdown Menü sollte auf jeden Fall das letzte Kindelement des expandable_lis sein. In CSS verweisen wir nämlich mit dem Geschwisterselektor ~ , der nur für nachfolgende Geschwisterelemente gilt.
@@coding-kurzundknapp moin. Danke dir für die schnelle Antwort. Schaue ich mir nachher an. Falls du helfen kannst/ nebenbei auch Jobs machst vielleicht kannst du mir bei meiner Seite helfen damit es nicht wie das Jahr 2000 aussieht. Brick-tracker de meine Daten findest du im Impressum. Grüsse
Gutes Video, aber du sprichst etwas schnell. So als hätte man die Geschwindigkeit auf 1,5 gestellt.
Könntest du denn Code herausgeben, bei mir hat es nicht funktioniert
Liebe deine Videos
Danke für das Lob. Den Code habe ich jetzt als Kommentar angepinnt. Viel Erfolg!
Dieses Video ist im Grunde genommen schon gut erklärt aber dennoch zu schnell.
sorry, kann dich nicht verstehen !!! 👎
Ich schreib dir ganz langsam, weil ich weis dass du nicht so schnell lesen kannst - aber bemühe dich mal normal zu sprechen, ohne dass ich die vidoe-geschwindigkeit rum-schrauben muss.
Danke für das Feedback.
Ich hab alles nachgemacht jedoch funktioniert das nicht . Hat das was mit html 5 zu tun ? Da es anscheinend nicht mehr benutzt wird . Trotzdem Danke
Ich hab die Browsercach gelöscht und jetzt geht es
@@mraddicted08 Am besten immer mit Strg + F5 reloaden, nicht nur mit F5; das löscht direkt beim Reload den Cache, ohne über das Menü gehen zu müssen. Dass ich mir das angewöhnt habe, hat mir die eine oder andere Frustration erspart. 😬