Rahmen um Bilder mit/ohne Ausrichtung

    Hallo zusammen,

    ich habe ein kleines Problem mit dem Design der Bilder in Blog-Posts. Ich möchte gern ein einzelnes Bild einfügen, das einen Rahmen hat. Dazu habe ich die css-Datei wie folgt verändert:

    .post img {border: 1px solid #bbb; padding:5px;}

    Das funktioniert soweit auch wunderbar.


    Sofern dem Foto allerdings eine Ausrichtung (linksbündig, zentriert...) zugewiesen wird, klappt es nicht mehr. In diesen Fällen wird dann beim "hover" durch den div-Container der Rahmen seitlich abgeschnitten und oben ein Abstand hinzugefügt, so dass das ganze Bild und nachfolgender Inhalt nach unten rutscht.

    Ist das Bild ohne ohne Ausrichtung eingestellt, passiert dies beim "hover" nicht. Hat jemand eine Idee, wie man das padding/margin in den ausgerichteten div-containern überschreiben kann? Oder irgendeine andere Lösung?

    Ich habs auch schon mit dem Plugin Wordpress-Image-Borders probiert - allerdings mit dem gleichen Problem.

    Grüße
    Cora

    • Gerade eben
    • 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

    hallo, hast eh den css inspektor rennen, dann ists leicht. schau dir die css klassen für left, right, center bei einem post image an (1. tab links - REGELN), denn offenbar werden eben dann deine werte neu definiert/überschrieben und somit ist der rahmen nicht sichtbar.
    siehst eh in echt, wenn du div oder class vorgaben deaktivierst oder anfügst. also einfach den border auch bei align left, center und right einfügen bzw die genannten klassen je nach dem was erwünscht ist ergänzen/anpassen (siehe das padding-top "problem" bei hover).
    die sind, falls ein standard theme oder gekauftes rennt in der style.css eventuell unter dem abschnitt "wordpress specific" oder so ähnlich zu finden. auf alle fälle auf die align left center und right bereiche schauen, und bei img hover. und bitte kein plugin dafür! das ist eine pure css geschichte ;-)
    und du führst dann die änderungen per custom.css aus, was nat. sauberer wäre. ;-)
    lg savantos

    Einmal editiert, zuletzt von Savantos (1. Mai 2014 um 21:59)

Jetzt mitmachen!

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

Benutzerkonto erstellen Anmelden