Auf Thema antworten 2026

Beitrag

<blockquote data-quote="dn3d_fanboy" data-source="post: 2559501" data-attributes="member: 547472">Hallo zusammen,Ich habe hier noch ein CSS-Problem, dass mich gerade etwas verzweifeln lässt.Und zwar erstelle gerade ein WordPress-Theme und setze folgen CSS-Effekt für Links im Contentbereich ein: [code=CSS]#page-content a {&nbsp; &nbsp; padding: 0 5px;&nbsp; &nbsp; &nbsp; &nbsp; color: #094d73;&nbsp; &nbsp; &nbsp; &nbsp; background: rgba(255,255,255,0.5);&nbsp; &nbsp; &nbsp; &nbsp; display: inline-block;&nbsp; &nbsp; &nbsp; &nbsp; vertical-align: top;&nbsp; &nbsp; &nbsp; &nbsp; -webkit-transform: translateZ(0);&nbsp; &nbsp; &nbsp; &nbsp; transform: translateZ(0);&nbsp; &nbsp; &nbsp; &nbsp; box-shadow: 0 0 1px rgba(0, 0, 0, 0);&nbsp; &nbsp; &nbsp; &nbsp; -webkit-backface-visibility: hidden;&nbsp; &nbsp; &nbsp; &nbsp; backface-visibility: hidden;&nbsp; &nbsp; &nbsp; &nbsp; -moz-osx-font-smoothing: grayscale;&nbsp; &nbsp; &nbsp; &nbsp; position: relative;&nbsp; &nbsp; &nbsp; &nbsp; -webkit-transition-property: color;&nbsp; &nbsp; &nbsp; &nbsp; transition-property: color;&nbsp; &nbsp; &nbsp; &nbsp; -webkit-transition-duration: 0.3s;&nbsp; &nbsp; &nbsp; &nbsp; transition-duration: 0.3s;}#page-content a:before {&nbsp; content: &quot;&quot;;&nbsp; position: absolute;&nbsp; z-index: -1;&nbsp; top: 0;&nbsp; left: 0;&nbsp; right: 0;&nbsp; bottom: 0;&nbsp; background: #0972A5;&nbsp; -webkit-transform: scaleX(0);&nbsp; transform: scaleX(0);&nbsp; -webkit-transform-origin: 0 50%;&nbsp; transform-origin: 0 50%;&nbsp; -webkit-transition-property: transform;&nbsp; transition-property: transform;&nbsp; -webkit-transition-duration: 0.3s;&nbsp; transition-duration: 0.3s;&nbsp; -webkit-transition-timing-function: ease-out;&nbsp; transition-timing-function: ease-out;}#page-content a:hover, #page-content a:focus, #page-content a:active {&nbsp; color: white;}#page-content a:hover:before, #page-content a:focus:before, #page-content a:active:before {&nbsp; -webkit-transform: scaleX(1);&nbsp; transform: scaleX(1);}[/code]Nun habe ich allerdings auch Bilder im Content, die ebenfalls verlinkt sind und wo dieser Effekt dann logischerweise auch greift. Ausprobiert habe ich jetzt schon einiges, aber ich bekomme diesen Hover-Effekt bei den Bildern nicht weg oder ich stehe komplett auf dem Schlauch. Hat von euch jemande eine Lösung parat?Hier mal ein Link, wo man es sich ansehen kann: (Siehe Bild unten &quot;iGZ&quot;).Ich danke euch schonmal im Voraus.</blockquote>

[QUOTE="dn3d_fanboy, post: 2559501, member: 547472"] Hallo zusammen, Ich habe hier noch ein CSS-Problem, dass mich gerade etwas verzweifeln lässt. Und zwar erstelle gerade ein WordPress-Theme und setze folgen CSS-Effekt für Links im Contentbereich ein: [code=CSS]#page-content a { padding: 0 5px; color: #094d73; background: rgba(255,255,255,0.5); display: inline-block; vertical-align: top; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } #page-content a:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: #0972A5; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } #page-content a:hover, #page-content a:focus, #page-content a:active { color: white; } #page-content a:hover:before, #page-content a:focus:before, #page-content a:active:before { -webkit-transform: scaleX(1); transform: scaleX(1); }[/code] Nun habe ich allerdings auch Bilder im Content, die ebenfalls verlinkt sind und wo dieser Effekt dann logischerweise auch greift. Ausprobiert habe ich jetzt schon einiges, aber ich bekomme diesen Hover-Effekt bei den Bildern nicht weg oder ich stehe komplett auf dem Schlauch. Hat von euch jemande eine Lösung parat? Hier mal ein Link, wo man es sich ansehen kann: (Siehe Bild unten "iGZ"). Ich danke euch schonmal im Voraus. [/QUOTE]

Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.

Authentifizierung

Wenn ▲ = 5, ▼ = 2 und ■ = 7, was ist ▲ × ▼ + ■?