hallo

ich habe eine Haupt-und eine Subnavigation. Die links in der Hauptnavigation müssen einen blauben "hover" besitzen. Der Link in normalem Zustand und Visited erscheint grau. Dies konnte ich via CSS einrichten. Für die Subnavigation müsste ich jedoch einen weissen "a, Hover, active visited" haben.ich duplizierte somit meine a zu einem .a

Wenn ich nun auf der Seite meine CSS anwählen möchte, erscheint die Auswahl für die Linksetzungen nicht. (.a, .a:visited, .a:hover, a.active)

Was mach ich falsch`?
Gruss
Den7


a { color: gray; text-decoration: none }
a:visited { color: gray }
a:hover { color: #2c94b5 }
a:active { color: gray }
.a { color: white; text-decoration: none }
.a:visited { color: white }
.a:hover { color: white; padding-top: 15px; padding-left: 15px }
.a:active { color: gray }
.fliesstext { color: #666; font-size: 14px; font-family: Verdana, Arial, Helvetica, sans-serif; line-height: 26px; padding-top: 15px; padding-left: 15px; left: 0 }
.fliesstext1 { color: #666; font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif; line-height: 15px; padding-top: 15px; padding-left: 15px; left: 0 }
.fliesstextschwarz { color: #000; font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif }
.fliesstextweiss { color: #fff; font-size: 14px; font-family: Verdana, Arial, Helvetica, sans-serif; line-height: 15px; padding-top: 15px; padding-left: 15px; left: 0 }
.navigation { color: #999; font-size: 18px; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; line-height: 28px; text-decoration: none }
.grauartwork { background-color: #d5d5d5 }
.inarbeit { color: white; font-size: 14px; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; }
.konzept { background-color: #99cc66 }
.weiss { background-color: #fff }
.gruen { background-color: #6FC283 }
.gruena { background-color: #57a771 }
.blau { background-color: #8db1D0 }
.blaua { background-color: #5f90b0 }
.grau { background-color: #a6a6a6 }
.graua { background-color: #7f7f7f }
.textaktiv { color: #2c9ab5; font-family: Verdana, Arial, Helvetica, sans-serif; padding-top: 15px; padding-left: 15px }
.textaktiv1 { color: #2c9ab5; font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif; padding-top: 15px; padding-bottom: 15px; padding-left: 15px }

Hallo Den,

lies am besten gleich hier nach:
http://www.hilfdirselbst.ch/..._P272992.html#272992

hallo Sabine

Nun, danke für deinen Tipp. Ich habe eine 2. klasse angelegt:

a { color: gray; font-size: 14px; font-weight: 500; text-decoration: none; letter-spacing: 3px; padding-left: 15px }
a:visited { color: gray; letter-spacing: 3px; padding-left: 15px }
a:hover { color: #2c94b5; letter-spacing: 3px; padding-left: 15px }
a:active { color: gray; letter-spacing: 3px; padding-left: 15px }
.zweiteklasse:a { color: white; font-size: 14px; text-decoration: none; padding-left: 10px }
.zweiteklase:visited { color: white; padding-left: 10px }
.zweiteklasse:hover { color: white; padding-left: 10px }
.zweiteklasse:active { color: white; padding-left: 10px
.drittklasse:a { color: gray; font-size: 10px; text-decoration: none }

Siehe seite: http://www.konzept-gestaltung.ch/index2.htm
den link www.dfportfolio.ch (unten links) möchte ich gerne mit .drittklasse:a
versehen.

Wenn man auf der Folgeseite ist: http://www.konzept-gestaltung.ch/portfolio/portfolio.htm möchte ich die 3 links corporate
design, spiele und packagin design weiss halten. (.zweiteklasse:a etc.)

kann mir jemand sagen, wieso das nicht funktioniert ??

Gruss
den7

Hallo Den,

versuchs mal so:

.zweiteklasse {color: white; font-size: 14px; text-decoration: none; padding-left: 10px }
.drittklasse { color:gray; font-size: 10px; text-decoration: none }

HTML für weißen Link

<a href="#" class="zweiteklasse">Link</a>

HTML für grauen Link

<a href="#" class="dritteklasse">Link</a>

hallo...

wir kommen der Sache schon etwas näher.

Der hover wird jetzt zwar weiss angezeigt. Jedoch sollte der Link im inaktiven Zustand auch weiss sein.

http://www.konzept-gestaltung.ch/portfolio/portfolio.htm

Siehe Link:

corporate
design

Wie setze Ich dazu den Link zentriert im TD ein? Wie muss ich das CSS erweritern?

Danke Euch.
Den

Hallo Den,

>> Jedoch sollte der Link im inaktiven Zustand auch weiss sein.

.zweiteklasse
gibt es immer noch nicht in Deiner CSS-Datei,

denn
.zweiteklasse:a
ist falsch

>> Wie setze Ich dazu den Link zentriert im TD ein?

<td align="center">

Hallo Sabine

Danke für dein Durhaltevermögen :-)

Nun, das hatte ich auch schon versucht. ich habe sie noch einmal mit "zweiteklasse" gesetzt.

Sie mal
http://www.konzept-gestaltung.ch/portfolio/portfolio.htm

Der Link erscheint leider immer noch nicht von anfang an weiss.

Gruss
Den

Hallo Den,

überprüfe mal diesen Code:

<a href="corporatedesign/portfolio.htm" class="zweiteklasse" "corporatedesign/portfolio.htm"="corporatedesign/portfolio.htm">corporate <br/> design</a>

Was soll das sein?
"corporatedesign/portfolio.htm"="corporatedesign/portfolio.htm"

Gruß Sabine

Hallo Sabine

Das heisst also, dass der richtige Code wie folgt lauten würde:
<a href="corporatedesign/portfolio.htm" class="zweiteklasse" >corporate <br/> design</a> Ist dies richtig?

Ich habe hier noch weitere Stiel Fragen.

Bei der Navigation mit den Aufzählungen home /portfolio / netzwerk / profil erscheint beim Normal Link nicht Verdana, sondern Times. Wieso wird hier das CSS nicht gelesen?

Auf der Netzwerk Seite http://www.konzept-gestaltung.ch/netzwerk.htm
werden die links mit einem Textabstand gelesen und haben einen linken Einzug (padding) Diesen Abstand hatte ich früher einmal via CSS gesteuert, jedoch habe ich diesen dann im CSS gelöscht. Leider wird dieser Abstand immer noch angezeigt sowie der Zeichenabstand. Wieso werden diese Befehle weiterhin angezeigt, obwohl das css diese Funktionen nicht mehr enthält?

Auch möchte ich das Bild mit dem grauen und blauen viereck am unteren Rand bündig ansetzen. Ich habe Das bild auf 200x200 px vergrössert. Diese Grösse ist identisch mit der Zellengrösse. Jedoch entsteht dieser untere Rand dazu. Wie krieg ich diesen Rand weg?

Die Seite sollte auf dem PC internet Explorer sowie auf dem Mac Safari identisch sein. Meine ersten Tests auf dem Mac waren jedoch erschreckend anders!! gibt es vielleicht unter selfhtml eine Seite die beschreibt, was für punkte zu beachten sind?..sonstige Tips vielleicht dazu? etc..

Vielen Dank für das Feedback!!!

Gruess
Den

>> <a href="corporatedesign/portfolio.htm" class="zweiteklasse" >corporate <br/> design</a>

Ja, das ist richtig.

>> home /portfolio / netzwerk / profil erscheint beim Normal Link nicht Verdana

Dann schaumal in Deine CSS-Datei, für diese Elemente hast Du keine Schrift festgelegt:

a
a:visited
a:hover
a:active

Gruß Sabine

ich habe die klasse nun wie folgt under der Seite:
http://www.konzept-gestaltung.ch/portfolio/portfolio.htm

gesetzt:
<p><a href="corporatedesign/portfolio.htm" class="zweiteklasse">corporate</a> <br/>
<a href="corporatedesign/portfolio.htm" class="zweiteklasse">design</a></p>

Ich muss die wörter einzeln mit der Klassifizierung setzen, das ansonsten das "design" nicht den gleichen Zellenabstand hat wie "corporate.

Die Einfärbung auf weiss klappt immer noch nicht!! was mach ich falsch?????

Dazu unter nezwerk http://www.konzept-gestaltung.ch/netzwerk.htm werden die Links mit Letterspacing gezeigt. AUch ist noch dieser hässliche "Padding left" ersichtlich, obwohl dies nicht im CSS integriert ist.

Die Schriftenangaben habe ich korrigiert. Danke für die Hilfe.

Den

Hallo Den,

>> Die Einfärbung auf weiss klappt immer noch nicht!! was mach ich falsch?????

Du hast für alle <a> Elemente grau festgelegt: color: gray

a { color: gray; font-size: 14px; font-family: Verdana, Geneva; text-decoration: none; letter-spacing: 3px; padding-left: 15px }
a:visited { color: gray; font-size: 14px; font-family: Verdana, Geneva; letter-spacing: 3px; padding-left: 15px }
a:hover { color: #2c94b5; font-family: Verdana, Geneva; letter-spacing: 3px; padding-left: 15px }
a:active { color: gray; font-family: Verdana, Geneva; letter-spacing: 3px; padding-left: 15px }

Ersetze diese Zeilen durch:

a {text-decoration: none;}

>> http://www.konzept-gestaltung.ch/netzwerk.htm werden die Links mit Letterspacing gezeigt.

Das hast Du für alle <a> Elemente festgelegt: letter-spacing: 3px; padding-left: 15px

a { color: gray; font-size: 14px; font-family: Verdana, Geneva; text-decoration: none; letter-spacing: 3px; padding-left: 15px }
a:visited { color: gray; font-size: 14px; font-family: Verdana, Geneva; letter-spacing: 3px; padding-left: 15px }
a:hover { color: #2c94b5; font-family: Verdana, Geneva; letter-spacing: 3px; padding-left: 15px }
a:active { color: gray; font-family: Verdana, Geneva; letter-spacing: 3px; padding-left: 15px }

Lege am besten für

a
a:visited
a:hover
a:active

immer nur solche CSS-Eigenschaften an, die für alle Links gelten sollen.

ich habe nun die Korrekturen vorgenommen:

http://www.konzept-gestaltung.ch/index2.htm

jedoch erscheint immer noch der Link im normalen Zustand blau. Er sollte jedoch grau eingefärbt und NICHT UNTERSTRICHEN erscheinen. (siehe Link info@konzept-gestaltung.ch)

Was ist falsch??

.ersteklasse { color: gray; font-size: 14px; font-family: Verdana, Geneva; text-decoration: none; letter-spacing: 3px; padding-left: 15px }
.ersteklasse:visited { color: gray; font-size: 14px; font-family: Verdana, Geneva; text-decoration: none; letter-spacing: 3px; padding-left: 15px }
.ersteklasse:hover { color: #2c94b5; font-family: Verdana, Geneva; text-decoration: none; letter-spacing: 3px; padding-left: 15px }
.ersteklase:active { color: gray; font-family: Verdana, Geneva; text-decoration: none; letter-spacing: 3px; padding-left: 15px }
.zweiteklasse { color: white; font-size: 14px; font-family: Verdana, Geneva; text-decoration: none; letter-spacing: 3px; padding-left: 10px }
.zweiteklase:visited { color: white; font-size: 14px; font-family: Verdana, Geneva; text-decoration: none; letter-spacing: 3px; padding-left: 10px }
.zweiteklasse:hover { color: white; font-size: 14px; font-family: Verdana, Geneva; text-decoration: none; letter-spacing: 3px; padding-left: 10px }
.zweiteklasse:active { color: white; font-size: 14px; font-family: Verdana, Geneva; text-decoration: none; letter-spacing: 3px; padding-left: 10px }
.dritteklasse { color: gray; font-size: 9px; font-family: Verdana, Geneva; text-decoration: none }
.vierteklasse { color: gray; font-size: 11px; font-family: Verdana, Geneva; line-height: 16px; text-decoration: none; padding-left: 15px }
.vierteklasse:hover { color: #2c94b5; font-size: 11px; font-family: Verdana, Geneva; line-height: 16px; text-decoration: none; padding-left: 15px }
.vierteklasse:visited { color: gray; font-size: 11px; font-family: Verdana, Geneva; line-height: 16px; text-decoration: none; padding-left: 15px }
.vierteklasse:active { color: gray; font-family: Verdana, Geneva; line-height: 16px; text-decoration: none; padding-left: 15px }
.fuenfteklasse { color: gray; font-size: 11px; font-family: Verdana, Geneva; text-decoration: none }
.fuenfteklasse:hover { color: #2c94b5; font-size: 11px; font-family: Verdana, Geneva; text-decoration: none }
.fuenfteklasse:visited { color: gray; font-size: 11px; font-family: Verdana, Geneva; text-decoration: none }
.fuenfteklasse:active { color: gray; font-size: 11px; font-family: Verdana, Geneva; text-decoration: none }

Meinst Du diesen Link?

<a href="mailto:info@konzept-gestaltung.ch">
<span class="fuenfteklasse">info@konzept-gestaltung.ch</span></a>

So sollte es klappen:

<a href="mailto:info@konzept-gestaltung.ch" class="fuenfteklasse">
info@konzept-gestaltung.ch</a>


Gruß Sabine