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

Zentriertes, responsive Logo

Dieses Thema im Forum "Design" wurde erstellt von mikashingu, 28. Dezember 2019.

Schlagworte:
  1. mikashingu

    mikashingu Member

    Registriert seit:
    3. Oktober 2016
    Beiträge:
    14
    Zustimmungen:
    0
    Hallo Zusammen,

    ich nutze Elementor Pro und OceanWP und habe ein Problem mit dem Logo. Mein Header ist zentriert mit Logo in der Mitte. Links und rechts je 1 NavMenu.

    Jedesmal, wenn ich den Bildschirm zusammenschiebe, verkleinert sich das Logo entsprechend und umgekehrt. Ich habe versucht, mit max-width: 100% und width: 460px des Elementor Containers entgegenzuwirken. Das klappt zum Teil...wenn ich die width weiter runterfahre, dann geht es zwar (100px), aber das Logo ist Mini.

    Jemand zufällig eine Idee, wie ich das Logo über die gesamte Browserverschiebung gleich gross lasse? Ich verzweifel...überall gehts, ich kanns nicht :(
    Gruss
    Mika
     
  2. Sailor56

    Sailor56 Well-Known Member

    Registriert seit:
    13. Juni 2017
    Beiträge:
    746
    Zustimmungen:
    85
    ... neee... wir verzweifeln :(.... wir soll man dir helfen, wenn du uns nicht schauen lässt, wo das Problem ist?
    Ein Link zur Seite würde helfen!
     
    Kurt Singer gefällt das.
  3. mikashingu

    mikashingu Member

    Registriert seit:
    3. Oktober 2016
    Beiträge:
    14
    Zustimmungen:
    0
    die Seite ist noch nicht online...
    aber hier ein Beispiel einer Seite von einer Freundin...http://www.keepyourflowers.de/
    da bleibt das Logo schön mittig und gleich gross. Wie geht das :)
    Sie kann ich nicht fragen = hat "nur" ein Template benutzt.
    Ich denke, vllt muss ich die height auf minimum setzen?
     
  4. SEpp55

    SEpp55 Well-Known Member

    Registriert seit:
    3. Februar 2016
    Beiträge:
    1.824
    Zustimmungen:
    225
    Das bleibt NICHT gleich groß!! Bei 550px ist Schluß mit gleich groß, weniger Breite -> viel kleiner!!!

    upload_2019-12-28_15-29-55.png

    Steht auch so in den CSS:
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    bis max.549px

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
    #4 SEpp55, 28. Dezember 2019
    Zuletzt bearbeitet: 28. Dezember 2019
  5. Sailor56

    Sailor56 Well-Known Member

    Registriert seit:
    13. Juni 2017
    Beiträge:
    746
    Zustimmungen:
    85
    Dann schau dir mal den Quellcode der Seite an... mit dem Webentwickler Tool 'Inspector' (hat jeder Browser), dort wirst du sehen, dass auf der Beispielseite ein äußerer Container als FlexBox definiert wird...
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    In dem sind dann 3 Container enthalten - das Logo in der Mitte.
    Das Bild wird dann mit
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    auf die gewünschte Größe 'gezwungen'... das Originalbild ist deutlich größer.
    Die Verkleinerung des Bild bei kleinem Bildschirm wir dann mit einer MediQuery umgesetzt.
     
  6. mikashingu

    mikashingu Member

    Registriert seit:
    3. Oktober 2016
    Beiträge:
    14
    Zustimmungen:
    0
    so...mit max-width hab ich es jetzt hinbekommen. Warum auch immer ich mich an max-height geklammert habe...jetzt geht es.
    Danke für die Hilfe...ihr habt mich auf die richtige Idee gebracht :)
     
  7. mikashingu

    mikashingu Member

    Registriert seit:
    3. Oktober 2016
    Beiträge:
    14
    Zustimmungen:
    0
    ok, ich habe es nicht hinbekommen. In Mobile und Tablet view siehts dann grausam aus.
    Mein Problem im Moment:
    Ich habe ein Menu mit 4 Bereichen. Links Menu mit 30%, dann das Logo mit 40%, My Account mit 20% und den Warenkorb mit 10%.
    Wähle ich "full width" aus, ist es nicht full width sondern, sobald ich das Browserfenster extrem gross mache, gibt es rechts und links einen Abstand...ok, das geht.
    Stelle ich auf Full Width und Stretch (Stretch the section to the full width of the page using JS), dann hab ich zwar die volle Breite, aber alles von rechts schiebt sich zusammen, dh die Abstande zwischen "My Account" und dem Cart Button werden kleiner.

    No matter what...das Logo schiebt sich immer zusammen. Stell ich es auf max-width: 400px, dann bleibt es erstmal gleich gross. Aber in Tablet und Mobile View ist das Logo nicht mehr mittig.

    Also ich raff es nicht...max-height funktioniert irgendwie auch nicht. I am dumm...
     
  8. mikashingu

    mikashingu Member

    Registriert seit:
    3. Oktober 2016
    Beiträge:
    14
    Zustimmungen:
    0
    ok, ich habs hinbekommen...
    Neues Logo, max und min width und alles wurde gut
    Vielen Dank nochmal :) Ihr habt den Weg geebnet...
     
  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