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

Rahmen um Bilder mit/ohne Ausrichtung

Dieses Thema im Forum "Design" wurde erstellt von coralys, 1. Mai 2014.

Schlagworte:
  1. coralys

    coralys Member

    Registriert seit:
    30. April 2014
    Beiträge:
    6
    Zustimmungen:
    0
    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.

    1.jpg


    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.

    2.jpg

    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
     
    #1 coralys, 1. Mai 2014
  2. Savantos

    Savantos Well-Known Member

    Registriert seit:
    15. November 2013
    Beiträge:
    109
    Zustimmungen:
    0
    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
     
    #2 Savantos, 1. Mai 2014
    Zuletzt bearbeitet: 1. Mai 2014
(Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können. )
  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.
    Akzeptieren Weitere Informationen...
    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.
    Akzeptieren Weitere Informationen...
    Information ausblenden