Verschiedene CSS Layouts für Verlinkungen erstellen/zuweisen
Hallo,
ich stehe gerade vor einem kleinen CSS-Problem auf meiner Seite. Ganz unten sieht man zwei "Buttons". Der untere "Registrierung für neue Mitglieder" entspricht schon dem Design, wie beide Buttons aussehen sollen. Beides sind Module:
HTML-Code:
<!-- indexer::stop -->
<div class="btn">
<a href="{{link_url::anmelden}}">Login für den Mitgliederbereich</a>
</div>
<!-- indexer::continue -->
und
HTML-Code:
<!-- indexer::stop -->
<div class="btn">
Registrierung für neue Mitglieder
</div>
<!-- indexer::continue -->
Das Problem besteht an der Stelle sobald ich mit arbeiten will. Sieht im CSS bei mir:
HTML-Code:
a {
line-height:1;
color:#000;
}
aus. Und entspricht dem Layout wie ich es sonst auf der Seite verwenden möchte, jetzt aber nicht bei den beiden Buttons. Ich glaube bei dem Problem führt eine Vererbung oder Priorisierung dazu, dass egal was kommt immer das CSS von "a" genutzt wird,... nur eine Vermutung xD
Das CSS für die Button sieht so aus:
HTML-Code:
.btn {
width:25%;
color:#fff;
-webkit-border-radius: 4;
-moz-border-radius: 4;
border-radius: 4px;
font-family: Georgia;
font-size: 20px;
background: #8a5cb3;
padding: 10px 20px 10px 20px;
text-decoration: none;
}
Hier ist auch die Schriftfarbe auf weiß gesetzt.
Meine Browsertabliste und diverse Googleanfragen habe mir bisher leider keine Klarheit verschaffen können. Ich hoffe jemand kann mir vielleicht diese CSS Grundlage oder meinen Denkfehler erklären ;)
Danke, WWSelec
*edit: Einen CSS Eintrag mit:
HTML-Code:
a.btn {
line-height:1;
color:#14decd;
}
habe ich testweise schon versucht, um eine Editierung nur bei "btn" zu erzwingen, leider ohne Erfolg.
