Kann mir bitte wer helfen, In der Desktop Ansicht schaut alles gut aus aber bei der Mobilen Ansicht sind die Content Bilder Groß und gehe über den Rand und der Index ist zu Schmal obwohl noch freie fläche vorhanden ich will das alles auf den vollen Bildschirm eines Mobilen Handys perfekt ausschaut. Wie kann ich das machen per CSS Code oder nur mit dem Styleeditor etwas ändern. Danke im voraus! Shop: www.liliope.com
Schau mal hier, https://www.gambio.de/forum/threads/bild-geht-ueber-den-rand.33360/#post-273553 Das von Barbara #4
super hat geklappt aber jetzt habe ich bei der desktop ansicht ein problem die bilder sind jetzt untereinander...ich habe nur einen Content Element benutzt mit vier bildern in der Textbeschreibung die ich selbst geordnet habe...wie mach ich es jetzt so das zwei kategorie bilder nebeneinander und die anderen zwei unter denen ist. siehe Onlineshop
Ich bin mir nicht ganz sicher, aber wenn du auf Quellcode gehst sollte der Code über jedes Bild. Probier mal, <div class="col-sm-6">
Nicht ganz Code: <div class="row"> <div class="col-md-6"> Hier kommt das erste Bild </div> <div class="col-md-6"> Hier kommt das zweite Bild </div> </div> Dann sind auf dem PC 2 Bilder nebeneinander
Danke euch beiden aber nach dem ich es so eingestellt habe sieht es jetzt in der Mobilen Ansicht jetzt wie auf dem bild das ich hier hochgeladen habe. Wie kann ich es wieder anpassen. Danke jetzt schon für eure hilfe
Versuche es mal so: Code: <div class="row"> <div class="col-xs-12 col-md-6"> Hier kommt das erste Bild </div> <div class="col-xs-12 col-md-6"> Hier kommt das zweite Bild </div> </div>
Ich kopier mal den Content Code hier vielleicht mach ich da was falsch...es zeigt wie auf dem bild ich wills aber untereinander bei mobiler ansicht... Code: <div class="row"> <div class="col-xs-12 col-md-6"> <a href="http://liliope.at/MINI/" target="_self"><img alt="" class="img-responsive" src="images/Kategoriebild_0-3MONATE.jpg" /></a> <a href="http://liliope.at/BABYJUNGEN/" target="_self"><img alt="" class="img-responsive" src="images/Kategoriebild_AB3monate_JUNGEN.jpg" /></a> </div> <div class="col-xs-12 col-md-6"> <a href="http://liliope.at/BABY-MAeDCHEN/" target="_self"><img alt="" class="img-responsive" src="images/Kategoriebild_Ab3monate_MADCHEN.jpg" /></a> <a href="http://liliope.at/BABY-DECKEN-EXCLUSIVE/" target="_self"><img alt="" class="img-responsive" src="images/deckenexklusive.jpg" /></a> </div> </div>
"col-xs-12" = auf kleinen Monitoren über die ganze Breite (Smaertphone, Tablet Portrait) "col-md-6" = auf größeren Monitoren über die halte Seite (tablet Landscape, Notebook, PC) Eigentlich sollte er also machen, was Du möchtest. Das ist Dein Code: HTML: <div class="row"> <div class="col-xs-12 col-md-6"> <a href="http://liliope.at/MINI/" target="_self"><img alt="" class="img-responsive" src="images/Kategoriebild_0-3MONATE.jpg"></a> <a href="http://liliope.at/BABYJUNGEN/" target="_self"><img alt="" class="img-responsive" src="images/Kategoriebild_AB3monate_JUNGEN.jpg"></a> </div> <div class="col-xs-12 col-md-6"> <a href="http://liliope.at/BABY-MAeDCHEN/" target="_self"><img alt="" class="img-responsive" src="images/Kategoriebild_Ab3monate_MADCHEN.jpg"></a> <a href="http://liliope.at/BABY-DECKEN-EXCLUSIVE/" target="_self"><img alt="" class="img-responsive" src="images/deckenexklusive.jpg"></a> </div> </div> Ändere das mal in: HTML: <div class="row"> <div class="col-xs-12 col-md-6"> <a href="http://liliope.at/MINI/" target="_self"><img alt="" class="img-responsive" src="images/Kategoriebild_0-3MONATE.jpg"></a> </div> <div class="col-xs-12 col-md-6"> <a href="http://liliope.at/BABY-MAeDCHEN/" target="_self"><img alt="" class="img-responsive" src="images/Kategoriebild_Ab3monate_MADCHEN.jpg"></a> </div> </div> <div class="row"> <div class="col-xs-12 col-md-6"> <a href="http://liliope.at/BABYJUNGEN/" target="_self"><img alt="" class="img-responsive" src="images/Kategoriebild_AB3monate_JUNGEN.jpg"></a> </div> <div class="col-xs-12 col-md-6"> <a href="http://liliope.at/BABY-DECKEN-EXCLUSIVE/" target="_self"><img alt="" class="img-responsive" src="images/deckenexklusive.jpg"></a> </div> </div>
#barbara Leider hat sich trotz deinem neuen Code nichts geändert. Was mach ich falsch oder woran kann es liegen. Ich möchte es genau so wie bei diesem Onlineshop machen www.ankerwelt.com. Die Mobileansicht soll genau wie du es sagst über die ganze breite sein... Bitte hilf mir möchte demnächst Werbung für meine Seite schalten und will dieses Problem so schnell wie möglich lösen.. Danke dir jetzt schon für deine Hilfe...
Hallo, ich möchte im Index 4 Bilder anzeigen, 2 nebeneinander und darunter zwei, wie im Shop von liliope.com. Diese sollten in der Desktop Ansicht korrekt nebeinander angezeigt werden, und in der mobilen Version dann untereinander. Leider sind diese in der Desktop Ansicht riesig groß, wenn ich beim Bild img-responsive eingebe. Was mache ich falsch? Vielen Dank für eure Hilfe Gambio Version: v3.10.0.3
Hier der Patient https://www.lange-damenhosen.de/ was du da jetzt, siehst ist ein Bild im Teaser Slider
das hilft jetzt aber nicht... Poste mal den Quellcode welchen du ohne erfolg getestet hast... (siehe Post #14)
Der Teaser-Slider zeigt immer ein Bild. Wenn Du da 2 Bilder nebeneinander haben möchtest, musst Du ein Bild mit 2 Motiven erstellen Bei liliope.com ist es nicht im Slider, sondern einfach so auf der Startseite
ja, das wollte ich auch so, im Freier Inhalt 1. Im Teaser ist jetzt nur eine Notlösung, so wie es jetzt dargestellt wird. Möchte es so wie bei z.B.liliope.com, bekomme es aber nicht hin