Designärger Netzblogger03

Wie wir ja wissen, ist das Netzblogger03-Design immer noch im Alphastadium. Es gibt hier immer noch so einiges zu tun was nicht passt.

Dazu zählen unter anderem auch die Smileys, wie beim letzten Beitrag wieder sichtbar wurde. Sie werden mit dem Rahmen der “eigentlichen” Bilder belegt, obwohl sie das nicht sollten. Hier scheint noch eine große Wissenslücke bzgl. CSS bei mir vorzuherrschen.
Aus Mangel einer speziellen Klassendefinition im image-Tag für die in Beiträge eingebundenen Bilder sieht der Spaß in CSS so aus:

.post img {
border: 1px solid #ddd;
padding: 3px;
background: #eee;
margin: 0 10px 0 10px;
}

Die Smileys allerdings werden im img-Tag mit class=”wp-smiley” deklariert und wurden von mir daher am Ende des Stylesheets mit folgender Klasse bedacht:

.wp-smiley {
padding: 0;
border: none;
background: none;
}

da das so aber nicht funktioniert habe ich auch schon “img .wp-smiley” und “.wp-smiley img” versucht - aber nichts wollte funktionieren. Langsam bin ich mit meinem Latein am Ende. Ist ja nicht so, dass ich mich nicht in jedem verf***** Blog damit rumgeärgert habe :(
any hints on that?

6 Responses to “Designärger Netzblogger03”


  1. 1 Stephan

    Hallo Netzblogger,

    bin mir nicht ganz sicher, aber probiere doch mal folgerndes.

    .wp-smiley {
    padding: 0px;
    border: 0px;
    background: #FFFFFF;
    }

    Bey
    Stephan

  2. 2 Netzblogger

    Hi Stephan,

    danke! grad mal ausprobiert - scheint aber leider nix zu bringen. :(

  3. 3 Stephan

    Schade, dann hätte ich noch eine Ideen.
    Versuche doch mal anstat .post img

    .postEntry img {
    padding: 0px;
    border: 0px;
    background: #FFF;
    }

    Den das ist die eigentliche Klasse, in der sich die Smileys befinden.

    Hoffentlich hilft dir das weiter.

    Bey
    Stephan

  4. 4 Netzblogger

    danke nochmal, Stephan.

    Wenn ich das so 1:1 mache, dann haben aber auch die normalen Bilder keinen Rahmen mehr - was vermutlich die einfachste Lösung wäre :)

    Ich hab’s dennoch mal übernommen und hab nur die Werte von Dir ausgetauscht gegen meine Ursprünglichen - bringt leider auch nix :(

  5. 5 Stephan

    Hm, und wen du es mal so probierst:

    .postEntry img .wp-smiley {
    padding: 0px;
    border: 0px;
    background: #FFF;
    }

    bzw.

    .post img .wp-smiley {
    padding: 0px;
    border: 0px;
    background: #FFF;
    }

    Hoffentlich klappt das so…

  6. 6 Stephan

    Ok, meinen letzten Kommentar kannst du vergessen. Aber ich hab jetzt mal etwas rumprobiert, und folgende Lösung hat bei mir funktioniert.


    img.wp-smiley {
    padding: 0px;
    margin: 0px;
    border: 0px;
    background: none;
    }

    Wichtig dabei ist, dass KEIN Leerzeichen zwischen img und .wp-smiley ist.

    Und wen du sowieso schon Änderungen in der CSS machst, währe eine größere Schrift für das code Tag sehr nützlich.

    Bey
    Stephan

Leave a Reply