1. Herzlich willkommen bei WPDE.org, dem grössten und ältesten deutschsprachigen Community-Forum rund um das Thema WordPress. Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können.
    Information ausblenden

.css NUR für das Tag-Widget

Dieses Thema im Forum "Design" wurde erstellt von bikershrek, 27. August 2010.

  1. bikershrek

    bikershrek Well-Known Member

    Registriert seit:
    16. Juni 2009
    Beiträge:
    67
    Zustimmungen:
    0
    Bitte um Hilfe.
    Ich möchte in meiner custom.css zu meinem Theme Formatierungen hinterlegen, die sich ausschließlich auf das Tag-Widget beziehen.

    Ein grauer Hintergrund mit Rahmen und runden Ecken, sodass dieses besser zu/in meine Sidebar passt.

    Wer nachschauen möchte: http://www.bikershrek.com

    Die generelle Formatierung:

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Danke. :)
     
    #1 bikershrek, 27. August 2010
    Zuletzt bearbeitet: 27. August 2010
  2. bego

    bego Well-Known Member

    Registriert seit:
    30. November 2005
    Beiträge:
    579
    Zustimmungen:
    4
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
  3. bikershrek

    bikershrek Well-Known Member

    Registriert seit:
    16. Juni 2009
    Beiträge:
    67
    Zustimmungen:
    0
    bego - du bist der Größte. :D
    Mega-Dank.
    Hat sofort funktioniert.
    Perfekt.
     
  4. bikershrek

    bikershrek Well-Known Member

    Registriert seit:
    16. Juni 2009
    Beiträge:
    67
    Zustimmungen:
    0
    Zur weiteren Perfektionierung meines Tag-Widget - bitte ich erneut um Hilfe.

    - Bei Mouseover über einen einzelnen Tag soll der Hintergrund dieses Tag farbig werden - diese farbige Markierung soll ähnlich dem Widget insgesamt auch abgerundete Ecken bekommen - die Textfarbe dieses Tag soll sich dabei ändern in weiss

    - Zeilenabstand der Tag-Zeilen 1,5-fach (sind mir aktuell zu dicht)

    Geht so was?
    Danke schon Mal vorab. :)

    Habe schon etliches probiert - klappt einfach nicht - meist wird das gesamte Widget farbig aber nicht nur der einzelne Tag, der mit de Maus überfahren wird.
     
  5. Domino5702

    Domino5702 Well-Known Member

    Registriert seit:
    30. April 2009
    Beiträge:
    2.634
    Zustimmungen:
    0
    Jupp, Stichwort ist die Pseudoklasse, in diesem Fall a:hover, das mit background-color: #xyz den gewünschten Hintergrund bekommt.

    Und für die Zeilenhöhe gibt es line-height - wenn die Schriftgrösse mit 12px definiert ist, also line-height:18px, ich glaube, es geht auch 150%, bin da aber nicht sicher.

    LG Domi
     
    #5 Domino5702, 30. August 2010
    Zuletzt bearbeitet: 30. August 2010
  6. bikershrek

    bikershrek Well-Known Member

    Registriert seit:
    16. Juni 2009
    Beiträge:
    67
    Zustimmungen:
    0
    Danke für die Tipps. :)
    Hatte ich schon probiert - klappt beides so nicht. :(
     
  7. Domino5702

    Domino5702 Well-Known Member

    Registriert seit:
    30. April 2009
    Beiträge:
    2.634
    Zustimmungen:
    0
    Ohje, wie hast Du es denn genau probiert? Denn eigentlich müsste es ja funktionieren ;)

    LG Domi
     
  8. bikershrek

    bikershrek Well-Known Member

    Registriert seit:
    16. Juni 2009
    Beiträge:
    67
    Zustimmungen:
    0
    Sorry, "müsste" reicht mir nicht wirklich. :)
    Hat denn niemand eine Idee?
    Gern auch die konkreten Codezeilen hier her.

    Zeilenabstand und Hintergrund des Link habe ich mit :
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    versucht.

    Auch fehlt mir noch die Blockdarstellung des farbigen Hintergrund - mit runden Ecken.
    Bei einem normalen Link (außerhalb des Tag-Widgets) habe ich folgenden Code:
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Damit schaut der Link wie von mir gewünscht aus - siehe Grafik unten.

    Nur wie füge ich beide Codes - diesen hier und den aus #2 funktionierend zusammen? :)
     
  9. Domino5702

    Domino5702 Well-Known Member

    Registriert seit:
    30. April 2009
    Beiträge:
    2.634
    Zustimmungen:
    0
    OK, also erstens: Du fragst hier nach Hilfe, und offensichtlich willste pfannenfertige Lösungen und bist nicht bereit, etwas mal selbst zu erarbeiten - wenn Dir müsste nicht reicht, stellen sich mir als Antwort die Nackenhaare auf!

    Runde Ecken - auch das wüsstest Du, wenn Du mal was lesen würdest - gibt es "aus der Dose" erst bei CSS3, sonst stellt sie nur FF, Opera und Safari dar, insbesondere bei IE musst Du halt die verschiedenen Rezepte anwenden, die es im Netz zuhauf gibt (zB. Bilder).

    Sorry, mehr gibt es dazu von mir nicht.

    LG Domi
     
  10. bikershrek

    bikershrek Well-Known Member

    Registriert seit:
    16. Juni 2009
    Beiträge:
    67
    Zustimmungen:
    0
    Hm. Solche wie dich Domino5702 - gibt es anscheinend in jedem Forum.
    Finde ich immer wieder schade.
    Erst irgendwelche Brocken posten, die ich als Laie nicht interpretieren kann und die so - wohl auch nicht funktionieren - und dann auch noch persönlich werden.
    Anscheinend weißt du es selbst nicht genau.

    Die beiden .css Codes, die ich hier veröffentlicht habe, funktionieren sehr wohl.
    Was du mit dem IE willst - ist mir auch nicht wirklich klar.
    Auf das Teil habe ich noch nie Rücksicht genommen - wer den nutzt ist selber schuld - ist aber bitte nur meine Meinung.

    Das ich nichts - wie du schreibst pfannenfertiges wünsche - sieht man wohl daran, dass ich fertigen und auch funktionierenden Code hier veröffentlicht habe.
    Nur ich bekomme diesen eben nur nicht zusammen.

    Auch habe ich schon mehreres probiert - nur es funktioniert eben nicht.
    Um einzuschätzen, ob es überhaupt klappen könnte - und wenn ja wie - dazu denke ich, sind Foren u.a. da.
    Wenn du das anders siehst - dann antworte eben einfach nicht auf solche Fragen wie meine.

    Ich hoffe dennoch auf weitere, produktive Hilfe.
    Danke. :)
     
    #10 bikershrek, 31. August 2010
    Zuletzt bearbeitet: 31. August 2010
  11. -=Marc=-

    -=Marc=- Well-Known Member

    Registriert seit:
    9. August 2007
    Beiträge:
    345
    Zustimmungen:
    0
    Moin,

    ohne jetzt auf Euren Disput einzusteigen ein Hinweis zu Folgendem:
    Da liegst Du falsch. Ich wiederhole das Beispiel nur zu gern, im Konzern und ebenfalls in einer benachbarten AG werden zwangsweise jede Menge IEs, davon massenhaft 6er Versionen (es geht tatsächlich nicht anders) genutzt. Gutes Template-Design zeichnet sich auch und insbesondere dadurch aus, dass auch diese Nutzer ins Boot geholt werden. Oder würdest Du als Geschäftsinhaber auf 30% und mehr potentieller Kunden verzichten wollen, nur weil Deine Eingangstür keine <[1]> Menschen durchlässt? ;)

    Gruß
    Marc
    [1] setze dicke, dünne, alte, junge, bunte etc. pp.

    Nachtrag: Hier findest Du aktuelle Zahlen aus 07.2010
     
    #11 -=Marc=-, 31. August 2010
    Zuletzt bearbeitet: 31. August 2010
  12. bikershrek

    bikershrek Well-Known Member

    Registriert seit:
    16. Juni 2009
    Beiträge:
    67
    Zustimmungen:
    0
    Ein Hinweis sei mir gestattet.
    In solchen Situationen wie dieser - liebe ich regelrecht Foren - in den Moderatoren sofort gnadenlos eingreifen - sobald wie hier, die Diskussion absolut OT läuft.

    Ich hoffe somit weiter, dass mir jemand helfen kann und das auch will. :)
    Danke.


    -=Marc=- rufe doch einfach mal meinen Blog über deinen IE auf. Also bei meinem IE werden die Seiten super angezeigt.
    Wenn die runden Ecken beim IE wegfallen, na und - dann sind sie da eben eckig. ;)
     
  13. -=Marc=-

    -=Marc=- Well-Known Member

    Registriert seit:
    9. August 2007
    Beiträge:
    345
    Zustimmungen:
    0
    zu Deinem Problem (Formatierung der Links innerhalb der Tag-Cloud): Befasse Dich mal intensiv mit Selektoren und deren kreative Nutzung. Durch diese kannst Du Elemente anhand ihrer "Verschachtelung" im HTML-Code gezielt ansprechen.
    Beispiel:
    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Angesprochen wird ein Element "a" der ID "sidebar". Und zwar der Link, welcher innerhalb einer Liste, die wiederum innerhalb einer Liste steht. Dazu erschwerend, hier findest Du die Deklaration des Stiles sowohl für den jungfräulichen Link, als auch für den aktiven Link. ;) Fies? Ach was, tapfer bleiben. Quelle des Beispiels (links die Menüpunkte).

    Einführung in Selektoren (engl.)
    Nachmal Selektoren (dtsch.)

    p.s.: Ich kann den Domi schon verstehen, Du kamst zwischendurch ziemlich "fordernd" rüber.
     
  14. bikershrek

    bikershrek Well-Known Member

    Registriert seit:
    16. Juni 2009
    Beiträge:
    67
    Zustimmungen:
    0
    Danke für den Lösungsansatz. :D
    Und sorry an Alle hier, wenn sich bei mir irgend was fordernd anhört.
    Das ist garantiert nicht so gemeint.

    Ich bin nur beruflich sehr viel Korrespondenz gewöhnt, die diese Art der Formulierungen beinhalten und wenn ich dann zwischendurch mal schnell im Forum poste - kann das schon mal falsch rüberkommen.

    Grundsätzlich meine ich alles nett und freundlich und niemals fordernd.
    Also sorry. :D

    Nachtrag:
    Ich habe mir jetzt die Seiten mit der Verschachtelung mal angeschaut und verstehe überhaupt nix.

    Ich gehe jetzt daher einfach davon aus, dass sich meine Frage hier von selbst erledigt und ich mich anderweitig um Hilfe bemühe, denn ich bekomme es selbst nicht hin.
    Sollte dennoch jemand so freundlich sein, und mir den zusammengesetzten Code liefern wollen, bedanke ich mich bereits jetzt sehr herzlich dafür.
     
    #14 bikershrek, 31. August 2010
    Zuletzt bearbeitet: 31. August 2010
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden