How do I make a large photo stretch across the width of the homepage? When the browser width is smaller the photo should also shrink to be smaller or vice versa. Currently when I load the photo to the homepage it displays unnecessary white space on the left and right side of the photo. I am using the multi vendor responsive 4.2.2.
Any help is appreciated. I am new to this so if you can provide thorough instructions I would appreciate it a lot.
Thanks
AlmondJJoy
Dear Almondjjoy,
To make the pictures of your site responsive you need to create a new class in your style.css:
[color=#282828][font=arial, verdana, tahoma, sans-serif].img-responsive {[/font][/color]
[color=#282828][font=arial, verdana, tahoma, sans-serif]max-width: 100%;[/font][/color]
[color=#282828][font=arial, verdana, tahoma, sans-serif]width: 100%;[/font][/color]
[color=#282828][font=arial, verdana, tahoma, sans-serif]height: auto;[/font][/color]
[color=#282828][font=arial, verdana, tahoma, sans-serif]}[/font][/color]
[color=#282828][font=arial, verdana, tahoma, sans-serif]To remain the image quality[/font][/color] you need to define larger image resolution in your Admin panel top menu > Settings > Thumbnails > [color=#333333]Product details page thumbnail width[/color].
Hi Almondjjoy,
If you need the images on your website be suitable for responsive themes, do not set up the strict limits of the width and height in px.
Best regards, Alt-team.