Bild geht über das Mobile Design hinaus

Dieses Thema im Forum "StyleEdit" wurde erstellt von Anonymous, 9. Oktober 2018.

  1. Anonymous
    Anonymous Erfahrener Benutzer
    Registriert seit:
    9. November 2016
    Beiträge:
    229
    Zustimmungen:
    2
    Gegebene Danke:
    60
    #1 Anonymous, 9. Oktober 2018
    Ich habe ein Bild online gestellt.
    Dieses sieht am PC und in der Desktop Version am Handy gut aus und passg genau in das Design.

    In der Mobilen Version geht das Bild jedoch über das Design hinaus wodurch sich alles verschiebt.

    Was muss ich ändern?

    (Link nur für registrierte Nutzer sichtbar.)

    Mobile Version:
    IMG_20181009_230323.jpg
     
  2. Anonymous
    Anonymous Erfahrener Benutzer
    Registriert seit:
    27. Mai 2016
    Beiträge:
    457
    Zustimmungen:
    99
    Gegebene Danke:
    103
    #2 Anonymous, 9. Oktober 2018
    Du hast das Bild mit festen Pixelbreiten definiert.
    Lösch mal bei den Einstellungen, wenn man im Editor auf das Bild klickt unter Bild bearbeiten, die Breite und Höhe also die Pixel Angaben raus!
     
  3. Anonymous
    Anonymous Erfahrener Benutzer
    Registriert seit:
    9. November 2016
    Beiträge:
    229
    Zustimmungen:
    2
    Gegebene Danke:
    60
    #3 Anonymous, 10. Oktober 2018
    Habe die Größen heraus genommen, leider ohne Verbesserung...



     
  4. Christian Mueller
    Christian Mueller Beta-Held
    Registriert seit:
    4. Juli 2011
    Beiträge:
    3.844
    Zustimmungen:
    997
    Gegebene Danke:
    313
    #4 Christian Mueller, 10. Oktober 2018
    1. In den Bildeigenschaften unter Breite und Höhe nichts eintragen.

    upload_2018-10-10_0-27-14.png

    2. unter Formatvorlagenklassen "img-responsive" eintragen.
    upload_2018-10-10_0-26-5.png
     
  5. Anonymous
    Anonymous Erfahrener Benutzer
    Registriert seit:
    9. November 2016
    Beiträge:
    229
    Zustimmungen:
    2
    Gegebene Danke:
    60
    #5 Anonymous, 10. Oktober 2018
    Super das funktioniert. Einzig: das Bild ist mobile in der mitte. Pc version jedoch linksbündig...

    So sieht der code im editor jetzt aus:

    <h1 style="text-align: center;"><img alt="" class="img-responsive" src="images/halloweenNF18V2.png" style="float: center;" /></h1>



     
  6. Christian Mueller
    Christian Mueller Beta-Held
    Registriert seit:
    4. Juli 2011
    Beiträge:
    3.844
    Zustimmungen:
    997
    Gegebene Danke:
    313
    #6 Christian Mueller, 10. Oktober 2018

    Mach mal aus dem "img-responsive" ein "center-block img-responsive"
     
  7. Anonymous
    Anonymous Erfahrener Benutzer
    Registriert seit:
    9. November 2016
    Beiträge:
    229
    Zustimmungen:
    2
    Gegebene Danke:
    60
    #7 Anonymous, 10. Oktober 2018
    Perfekt!! Danke!