[3.2] Eigene Linkbar im Header - irgendwo stimmt es nicht
Verfasst: 16.10.2018 10:22
Seit Ewigkeit stehe ich jetzt vor dem Problem, dass es im Dropdown Menu meiner Linkbar ziemlich müstisch aussieht.
- Versuch in der style.css das Dropdown für die Linkbar zu konfigurieren, greift nie.
- Die Font Awesome Icons zu konfigurieren bringt auch nichts.
- Funktioniert eigentlich so weit, wie gewünscht nur eben in der responsiven Ansicht sieht es etwas komisch aus im Dropdown.
Deshalb frage ich mich langsam, ob ich das in der html Datei falsch gemacht habe.[ externes Bild ]
linbar.html
style.css
Beitrag könnte ich eigentlich jetzt wieder löschen
. Wer sich das Lehrlingstutorial nochmals genau anschaut, anstatt tagelang rumzuwursteln ist klar im Vorteil. Ausserdem muss man nicht doof nachfragen hier. Ich könnte mich jetzt grad selber ohrfeigen!
https://www.youtube.com/watch?v=mMMrpMzNg7U
Ob mit der html Datei jetzt so alles stimmt weiss der Himmel. Aber es sieht mindestens jetzt alles korrekt aus. [ externes Bild ]
linkbar.html
Edit:
So ganz korrekt ist meine html Datei - meine Lösung schon nicht
. Sobald ich einen Border machen will, entsteht ein blauer Punkt. [ externes Bild ]
Jetzt sieht es oben okay aus [ externes Bild ]
Aber in der linkbar.html stimmt definitiv etwas nicht. Der Wrap bottom unten ist zu lang - respektive geht bis ans Ende der Seite. Aber da komm ich auch noch dahinter.
linkbar.html
Edit: Der Fehler mit dem Footer scheint die Ursache in der Overall_ header.html zu haben, wo meine linkbar.html dann irgendwie falsch eingefügt wurde. Denn selbst, wenn ich den ganzen Inhalt der navbar_header.html einfüge, stimmt es unten beim footer nicht.
- Versuch in der style.css das Dropdown für die Linkbar zu konfigurieren, greift nie.
- Die Font Awesome Icons zu konfigurieren bringt auch nichts.
- Funktioniert eigentlich so weit, wie gewünscht nur eben in der responsiven Ansicht sieht es etwas komisch aus im Dropdown.
Deshalb frage ich mich langsam, ob ich das in der html Datei falsch gemacht habe.[ externes Bild ]
linbar.html
Code: Alles auswählen
<div class="linkbar" role="navigation">
<div class="inner">
<ul id="nav-header" class="nav-header linklist" role="menubar">
<li class="linkbar">
</li>
<li class="leftside">
<i class="icon fa-suitcase fa-fw" aria-hidden="true"></i><span><a href="https://www.forum.my-tastenworld.ch/keyboard-links">KEYBOARDLINKS</a></span>
</a>
</li>
<li class="leftside">
<i class="icon fa-link fa-fw" aria-hidden="true"></i><span><a href="https://www.forum.my-tastenworld.ch/diverse-links">DIVERSE LINKS</a></span>
</a>
</li>
</ul>
</div>
</div>
Code: Alles auswählen
.linkbar {
color: #CCAE71;
background-color: #000;
border-radius: 7px;
margin: -1px 0 6px 0;
padding: 3px;
}
.linkbar a {
color: #CCAE71;
font-weight: bold;
font-size: 13px;
}

https://www.youtube.com/watch?v=mMMrpMzNg7U
Ob mit der html Datei jetzt so alles stimmt weiss der Himmel. Aber es sieht mindestens jetzt alles korrekt aus. [ externes Bild ]
linkbar.html
Code: Alles auswählen
<div class="linkbar" role="navigation">
<div class="inner">
<ul id="nav-header" class="nav-header linklist" role="menubar">
<li class="linkbar">
</li>
<li>
<a href="https://www.forum.my-tastenworld.ch/keyboard-links" title="KEYBOARDLINKS" role="menuitem">
<i class="icon fa-suitcase fa-fw" aria-hidden="true"></i><span>KEYBOARDLINKS</span>
</a>
</li>
<li>
<a href="https://www.forum.my-tastenworld.ch/diverse-links" title=">DIVERSE LINKS" role="menuitem">
<i class="icon fa-link fa-fw" aria-hidden="true"></i><span>DIVERSE LINKS</span>
</a>
</li>
</ul>
</div>
</div>
So ganz korrekt ist meine html Datei - meine Lösung schon nicht

Jetzt sieht es oben okay aus [ externes Bild ]
Aber in der linkbar.html stimmt definitiv etwas nicht. Der Wrap bottom unten ist zu lang - respektive geht bis ans Ende der Seite. Aber da komm ich auch noch dahinter.
linkbar.html
Code: Alles auswählen
<div class="linkbar" role="navigation">
<div class="inner">
<ul id="nav-header" class="nav-header linklist" role="menubar">
<li>
<a href="https://www.forum.my-tastenworld.ch/keyboard-links" title="KEYBOARDLINKS" role="menuitem">
<i class="icon fa-suitcase fa-fw" aria-hidden="true"></i><span>KEYBOARDLINKS</span>
</a>
</li>
<li>
<a href="https://www.forum.my-tastenworld.ch/diverse-links" title=">DIVERSE LINKS" role="menuitem">
<i class="icon fa-link fa-fw" aria-hidden="true"></i><span>DIVERSE LINKS</span>
</a>
</li>
<li>
<a href="https://www.forum.my-tastenworld.ch/keyboard-links" title="ON YOUTUBE" role="menuitem">
<i class="icon fa-youtube fa-fw" aria-hidden="true"></i><span>ON YOUTUBE</span>
</a>
</li>
<li>
<a href="https://www.forum.my-tastenworld.ch/keyboard-links" title="ON FACEBOOK" role="menuitem">
<i class="icon fa-facebook fa-fw" aria-hidden="true"></i><span>ON FACEBOOK</span>
</a>
</li>
</ul>
</div>
</div>