[HELP NEEDED] Issue with responsive design 
Author: Maxime ServaisHi there,
I have an issue with the responsive design of my website. See the file attached, it should make it clear (I hope)
Here is the meaning of the "method 1" file :
Step 1 : I add an image on my homepage
Step 2 : It is the first thing to appear in the responsive design
What it looks like 1 : As you can see, there is some white space between the image and the menu and some space on the left and right of the image. Is there a way to remove theses spaces?
What it looks like 2 : It looks nice on a tablet/smartphone, no worries here.
Method 2 :
Step 1 : I go on the site map > settings
Step 2 : I add my image (with the right format).
What it looks like 1 : It looks really nice, very professional when I add this image this way. There is no white space anymore on the left, right and top of the image.
What it looks like 2 : Unfortunately, it is not responsive, when looking at my website from a tablet or smartphone, it looks really shitty.
My question : Do you know a way to increase the size of the image (in method 1) so that it takes the whole space available while still being responsive ?
Or do you know a way in method 2 to make the image responsive ? Or is there a way to decide to remove the image when looking at the website from a tablet or smartphone but not from a computer?
I hope someone will be able to help me,
Thank you all,
Maxime
Author
Method 1 : step 2
Author
Method 1 : step 2
Author
Method 1 : What it looks like 1
Author
Method 1 : What it looks like 1
Author
This is a real mess, I need to upload a zip file of 5gb, I tried uploading each screenshot separetely but the website keeps crashing all the time, there is no way I can post my issue. Can the support close this post and get in contact with me? Thank you :)
Maxime, whilst you are waiting to hear from Incomedia
You should be able to resolve the issue of white space around your image by right clicking on the cell (as in your first attachment), select object style and edit and reduce the inner and outer margins. If you want to get to the extreme edge of your design, you will also need to reduce the margins in Template, template structures, page contents.
If you ever upgrade to 13 you can also take advantage of the new row formats feature which lets you place an image behind one or many rows of cells and optionally stretch to browser width with or without parallax effect.
Author
Hi,
Thank you for your help ! It did the trick for the space between the picture and the menu :) But I haven't been able to figure out how to reduce the space on the left and the right :/ (I have followed your instructions, everything has been set to 0)
Here is what I used to do (method 2) so that it would take the whole space available. Unfortunately, it's not responsive when I do it like that :/
Author
Here is what I do : I upload my picture there
Author
And here is the result, it looks really nice (but it's not responsive...) is there a way to make it responsive?
Hi Maxime
If you use cell style, image background, do not repeat, centred, you will come up with something that is "almost" responsive.
What you want to do is built in to V13 (background image behind a row of cells, responsive, with parallax if you want, extend to page edge or width of browser) - it is the reason I upgraded, but I was also handed far greater control over headers and footers and a few other "nifty" features.
I do not work for Incomedia - I don't mean to sound like a salesman, but version 13 is the best thing Incomedia have done (in spite of a few "issues")
Author
Thanks you for your answers :)
I think I will just leave it as it is now but if the Incomedia support can help me figure out how to remove the white space on the left and right, I would be really happy about it :)
Kind regards,
Maxime
Hello Maxime,
I've flagged this thread for the attention of the Incomedia support team.
Please allow 24/48 hours for a response from them.
Kind regards,
Paul
Hello Maxime,
You want the image to use all the available space on the screen?
In this case you need to use the image in the row style and then select to extend it to the whole browser width.
You can as example use the html code object and there set the height of the image and then in the row style add the image to this object:
http://help.websitex5.com/en/v13/pro/aspetto_riga.htm
Many thanks!