Bekomme CSS Liste nicht hin

  • Ich will mittels einem Text Widget eine Liste zeigen die verschiedene Feeds anbietet. Listenzeichen sollen die entsprechenden Icons sein.

    ich rufe hier mit im Widget die Links auf:

    Code
    <div id="subscribe">
      <ul>
        <li class="feed-abo"><a href="http://pixeltunes.de/feed/">Beitr&auml;ge RSS</a></li>
        <li class="feed-abo"><a href="http://pixeltunes.de/comments/feed/">Kommentare RSS</a></li>
        <li class="newsletter-abo">E-Mail Newsletter (folgt asap)</li>
        <li class="twitter"><a href="http://twitter.com/pixeltunes">Twitter</a></li>
      </ul>
    </div>

    Im stylesheet steht dies im Footer. Dort sol die Liste auch erscheinen.

    Die Icons werden jedoch nicht angezeigt!! Was mache ich falsch?

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Mach mal hier den Punkt weg. Laut Validator stimmt das so nicht. Vielleicht geht es ja dann:

    Code
    #subscribe li. {

    Edit: Ne, ist noch was anderes. Deine Regel ist weniger spezifisch als eine vom Hybrid-Theme definierte Regel:

    Code
    #subscribe li.feed-abo (linie 1092)
    #subsidiary .widget ul li (linie 1040)

    Schreib Deine Regeln dafür also z.B. so, dann sollten sie spezifischer sein:

    Code
    #subsidiary .widget #subscribe li.feed-abo

    Einmal editiert, zuletzt von Ammaletu (14. Januar 2010 um 21:47)

  • Du vergisst die Bedeutung des ersten Wortes von "CSS" ;)
    Cascading, Kaskade oder auch die Vererbung von Eigenschaften. Eines der Stylesheets, die du per @import-Regel eingebaut hast, überschreibt dir diese Definitionen. Abhilfe kann die !important-Eigenschaft schaffen oder bsser noch du schaust dir an welche Definition dem im Wege steht.

    Außerdem würde ich hier mit IDs arebiten, die sind in der Rangliste noch höher als Klassen. Beispiel:

    Code
    <div id="yellow" class="blue">Hallo</div>
    Code
    #yellow { background-color: yellow }
    .blue {background-color: bue }


    Auch wenn er durch die Vererbungsregel theoretisch blau anzeigen müsste, wird hier die Definition der ID der der Klasse vorgezogen, weil eine ID eben einzigartig ist :)

  • Zitat

    Außerdem würde ich hier mit IDs arebiten, die sind in der Rangliste noch höher als Klassen.

    Und genau deswegen würde ich IDs nur sehr spärlich einsetzen. Wenn man das später doch noch mal wieder überschreiben will, muss man sich dann sehr verrenken oder tatsächlich zu !important greifen. Aus genau diesem Grund würde ich auch !important nie verwenden. Da macht sich man sich nur selber Ärger mit. ;-)

  • So, kurzes Statement.
    Klappt nun mit der Spezifikation recht gut.
    meine RSS und twitter Links gehen, nur merkwürdigerweise der Feedburner Newsletter Link überhaupt nicht.

    ich seh inzwischen vor lauter css überhaupt keine styles mehr ;-)

    Ich nutze diesen code im css:

    Das ist der aufruf der Links:

    Code
    <li class="newsletter-abo"><a href="http://feedburner.google.com/fb/a/mailverify?uri=VonPixeln/Paddeln&loc=de_DE/">E-Mail Newsletter </a></li>

    Ergebniss ist in meinem testblog http://oli.pixeltunes.de im Footer zusehen.
    Ich komme da nicht hinter

  • jau, schnackelt inzwischen. Hab echt vor lauter "Pixelschrauberei" das leeren des Cache nicht bedacht. Immer nur F5 war wohl doch zuwenig.

    Eigentlich kann der Thread jetzt auf Resolved gesetzt werden :-)

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!