Das problem ist das es sich keiner runterladen wird um dir zu helfen.
Du sagst das es in der Mobilen Ansicht ist. Kuck mal in der Css Datei nach ob da irgendwo was von @media queries steht. Da wirst du die Daten wahrscheinlich ändern müssen.
Kannst du dein Html und Css mal posten wenn es nicht zu groß ist ?
Das problem ist das es sich keiner runterladen wird um dir zu helfen.
Du sagst das es in der Mobilen Ansicht ist. Kuck mal in der Css Datei nach ob da irgendwo was von @media queries steht. Da wirst du die Daten wahrscheinlich ändern müssen.
Kannst du dein Html und Css mal posten wenn es nicht zu groß ist ?
Klar. Ich habe mittlerweile etwas Fortschritt gemacht :). Wenn ich im "style-narrower.css" die Zeile "#navPanel .link:active { color: red; }" einfüge sind die Linke beim anklicken rot. Allerdings bleibt dies leider nicht so sondern das rot bleibt nur während dem Klick 
Sorry, aber wie geht das mit den Anhängen? Bei mir erscheint immer ein "unbekannter Fehler".
Kannst die Files von meinem Server herunterladen: Download dann auf "Ordner herunterladen" (Einzige Änderung von mir ist Zeile 192-196 im style-narrower.css)
Vielen Dank für deine Hilfe. Ich glaube langsam aber sicher verzweifle ich 
du sollst nix anhängen du sollst den Code als text Kopieren und hier in den code Tags einfügen </> . Der bleibt beim klicken rot weil du ja auch :active nutzt
Achso, sorry^^
HTML:
<!DOCTYPE HTML>
<html>
<head>
<title>Solarize by TEMPLATED</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<!--[if lte IE 8]><script src="css/ie/html5shiv.js"></script><![endif]-->
<script src="js/jquery.min.js"></script>
<script src="js/jquery.dropotron.min.js"></script>
<script src="js/skel.min.js"></script>
<script src="js/skel-layers.min.js"></script>
<script src="js/init.js"></script>
<noscript>
<link rel="stylesheet" href="css/skel.css" />
<link rel="stylesheet" href="css/style.css" />
</noscript>
<!--[if lte IE 8]><link rel="stylesheet" href="css/ie/v8.css" /><![endif]-->
</head>
<body class="homepage">
<!-- Header Wrapper -->
<div class="wrapper style1">
<!-- Header -->
<div id="header">
<div class="container">
<!-- Logo -->
<h1><a href="#" id="logo">Solarize</a></h1>
<!-- Nav -->
<nav id="nav">
<ul>
<li class="active"><a href="index.html">Home</a></li>
<li>
<a href="">Dropdown</a>
<ul>
<li><a href="#">Lorem ipsum dolor</a></li>
<li><a href="#">Magna phasellus</a></li>
<li><a href="#">Etiam dolore nisl</a></li>
<li>
<a href="">Phasellus consequat</a>
<ul>
<li><a href="#">Lorem ipsum dolor</a></li>
<li><a href="#">Phasellus consequat</a></li>
<li><a href="#">Magna phasellus</a></li>
<li><a href="#">Etiam dolore nisl</a></li>
<li><a href="#">Veroeros feugiat</a></li>
</ul>
</li>
<li><a href="#">Veroeros feugiat</a></li>
</ul>
</li>
<li><a href="left-sidebar.html">Left Sidebar</a></li>
<li><a href="right-sidebar.html">Right Sidebar</a></li>
<li><a href="no-sidebar.html">No Sidebar</a></li>
</ul>
</nav>
</div>
</div>
</body>
</html>style.css
@import url("font-awesome.min.css");
@import url("http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800");
/* Basic */
body {
background: #222222;
}
body.loading * {
-moz-transition: none !important;
-webkit-transition: none !important;
-o-transition: none !important;
-ms-transition: none !important;
transition: none !important;
-moz-animation: none !important;
-webkit-animation: none !important;
-o-animation: none !important;
-ms-animation: none !important;
animation: none !important;
}
body, input, select, textarea {
color: #555555;
font-family: 'Open Sans', sans-serif;
font-size: 12pt;
font-weight: 300;
line-height: 1.65em;
}
a {
color: #82b440;
text-decoration: underline;
}
strong, b {
font-weight: 700;
}
em, i {
font-style: italic;
}
p, ul, ol, dl, table, blockquote {
margin: 0 0 2em 0;
}
p {
line-height: 1.8em;
}
p.medium {
font-size: 1.4em;
}
h1, h2, h3, h4, h5, h6 {
color: inherit;
font-weight: 700;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
color: inherit;
text-decoration: none;
}
h2 {
font-size: 1.5em;
}
h3 {
font-size: 1.25em;
}
sub {
font-size: 0.8em;
position: relative;
top: 0.5em;
}
sup {
font-size: 0.8em;
position: relative;
top: -0.5em;
}
hr {
border-top: solid 1px #82b440;
border: 0;
margin-bottom: 1.5em;
}
blockquote {
border-left: solid 0.5em #82b440;
font-style: italic;
padding: 1em 0 1em 2em;
}
section.special, article.special {
text-align: center;
}
/* Header */
#header {
color: white;
height: 4em;
background: rgba(0, 0, 0, 0.5);
}
#header .container {
position: relative;
}
.homepage #logo {
display: none;
}
.homepage #nav {
position: static;
right: none;
text-align: center;
}
#logo {
line-height: 2em;
letter-spacing: 2px;
text-transform: uppercase;
font-size: 2em;
font-weight: 400;
}
#logo h1 {
display: inline-block;
margin: 0;
padding: 0;
}
#logo a {
color: inherit;
}
#nav {
position: absolute;
top: 0;
right: 0;
}
#nav > ul {
margin: 0;
}
#nav > ul > li {
border-radius: 4px;
display: inline-block;
margin-left: 0.5em;
padding: 0 0.5em;
}
#nav > ul > li a {
color: inherit;
line-height: 4em;
letter-spacing: 2px;
text-decoration: none;
text-transform: uppercase;
font-weight: 400;
font-size: 1em;
}
#nav > ul > li:first-child {
margin-left: 0;
}
#nav > ul > li.active a {
color: white;
}
#nav > ul > li > ul {
display: none;
}
/* Dropotron */
.dropotron {
top: 2em;
background: rgba(32, 32, 32, 0.75);
border-radius: 4px;
color: inherit;
min-width: 12em;
padding: 1em 0;
color: white;
}
.dropotron > li {
line-height: 2em;
padding: 0 1em;
}
.dropotron > li > a {
color: inherit;
letter-spacing: 2px;
text-decoration: none;
text-transform: uppercase;
}
.dropotron > li.active > a, .dropotron > li:hover > a {
color: inherit;
}
.dropotron.level-0 {
border-radius: 0 0 4px 4px;
font-size: 1em;
margin-left: -0.5em;
}style-narrower.css
/* Basic */
#skel-layers-wrapper {
padding-top: 44px;
}
p {
line-height: 1.8em;
}
header.major h2 {
font-size: 1.8em;
}
header.major .byline {
font-size: 1.1em;
}
/* Layers */
#navPanel {
background: #000;
}
#navPanel .link {
border-top: solid 1px rgba(0, 0, 0, 0.15);
color: #888;
display: block;
height: 44px;
line-height: 44px;
padding: 0 1em 0 1em;
text-decoration: none;
}
#navPanel .link:first-child {
border-top: 0;
}
#navPanel .link.depth-0 {
color: #fff;
}
#navPanel .link .indent-1 {
display: inline-block;
width: 1em;
}
/*Diese Zeile wurde von mir eingefügt!*/
/*Der Link bleibt aber nur während dem Klicken rot und bleibt leider nicht so..*/
#navPanel .link:active { color:red !important; }Musste wegen Zeichenlimit unnötige Zeilen löschen. Mein Wunsch: Auf der Seite Home soll Home rot sein:
html-seminar.de/woltlab/attachment/1632/
Danke für die Hilfe - Falls irgendwer das schaffen sollte gibt's ne Belohnung von mir
Und warum schreibst du hier nicht red rein
#nav > ul > li.active a {
color: white;
}Sehe gerade das du mobiles Menü meintest ? Bin auch schon blöd, habe ich irgendwie überlesen.
Beim Mobilen Menü könnte es so nicht gehen. Aber um dir das genau sagen zu können fehlt mir da irgendwas.
Wo ist den das #navPanel ?
denke das es von den skel Script kommt oder s . Aber will jetzt nicht spekulieren.
Hast du das schon Online irgendwo ?
Dann gib mal denLink.
Oder mach mal bei Codepen ein pen fertig. Mit den wichtigsten daten und cs und wenn vorhanden mit der Js.
Füge aber nur die Datein ein die man brauch um den Fehler zu bekommen. <footer> und so ein kram werden wir hier für nicht brauchen.
Aber an besten wäre ein Link weil da kann man sofort sehen welche Klasse was ist und so weiter . Dann hast du die Antwort in 5 Minuten.
Kannst notfalls auch ein freehoster nehmen.
Du willst in Mobilen Menü den Oberen HOME Link rot haben ?
Dann gib mal das zu deiner Css dazu
#navPanel .link.depth-0:nth-child(1) {
color: red;
}Zumindest ist es bei mir dann rot
Achso .Weil du die ganze Zeit davon redest das du home rot haben woltest.
Ja dann muß ich nochmal kucken.
Also soll immer der rot sein den du gerade angeklickt hast ?
Denk dran wenn du normale Links hast ,wechselt die Seite und das angeklickte ist nicht mehr rot,dazu müste man es irgendwie speichern. Lädst du den Inhalt über Ajax ist das kein problem.
Aber das wahr jetzt nur nee Info die du später vieleicht brauchst
Auf der schnelle muß ich passen. Weil der ganze kram bei mir nicht läuft,nur auf dein Link.Kopiere ich es bei mir rein Funktioniert die Mobile Ansicht nicht.Also müsste ich erst das beheben damit ich weiter machen kann.
Du sagtest das es in der Laptop ansicht funktioniert mit den angeklickten,das es rot bleibt ? Das geht bei mir nicht und bei dir auf den Link auch nicht bei mir.
Das jetzt alles so anzupassen wie du es wolltest bekomme ich auf der schnelle nicht hinVieleicht hat zwischen zeitig einer mehr Zeit dazu.
Eine Javascript Lösung hätte ich sofort nur das willst du ja bestimmt vermeiden und dazu brauche ich mehr zeit mir das alles genauer anzukucken.
Vieleicht blickt da einer von den Profis schneller durch als ich.
Sobald es heute Nacht kälter ist werde ich mal kucken wenn bis dahin nix passiert ist OK ?
Ich habe jetzt nicht alles gelesen, aber wenn Du es in der Desktop-Variante hinbekommst, was für Probleme hats Du dann in der mobilen Version?
Das Prinzip ist nicht ViewPort gebunden!
Du hast zwei Navigationen, was im Prinzip unnötig wäre, aber zumindest musst Du dann auch bei der mobilen Navi dem entsprechenden Eintrag eine CS-Klasse active spendieren, wie Du es bei der Desktop-Navi auch machst.
Vorausgesetzt, Du hast das selber gemacht und nicht irgendwo stumpf kopiert in der Hoffnung, alles läuft?
Nein, das ist ein Pseudo-Selektor. Schau Dir die Desktop-Navi an, dort erhält das entsprechende Item die CSS-Klasse active:
)<li class="active" ...Das verstehe ich. Aber weshalb bleiben die Links denn nicht rot? Die Klasse wurde ihnen ja unabhängig vom CSS zugewiesen mit <li class="active" ..und sollten doch auch so bleiben?
Sorry, bin Anfänger 
Nein, den Items der mobilen Navigation wird diese Klasse eben nicht zugewiesen! Das ist Dein Problem.
Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!