WebSite X5Help Center

 
Maxime Servais
Maxime Servais
User

[HELP NEEDED] Issue with responsive design  en

Autor: Maxime Servais
Visitado 1683, Followers 1, Compartido 0  

Hi 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

Publicado en
13 RESPUESTAS - 1 CORRECTO
Maxime Servais
Maxime Servais
User
Autor

Method 1 : step 2

Leer más
Publicado en de Maxime Servais
Maxime Servais
Maxime Servais
User
Autor

Method 1 : step 2

Leer más
Publicado en de Maxime Servais
Maxime Servais
Maxime Servais
User
Autor

Method 1 : What it looks like 1

Leer más
Publicado en de Maxime Servais
Maxime Servais
Maxime Servais
User
Autor

Method 1 : What it looks like 1

Leer más
Publicado en de Maxime Servais
Maxime Servais
Maxime Servais
User
Autor

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 :)

Leer más
Publicado en de Maxime Servais
Esahc ..
Esahc ..
Moderator

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.

Leer más
Publicado en de Esahc ..
Maxime Servais
Maxime Servais
User
Autor

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 :/

Leer más
Publicado en de Maxime Servais
Maxime Servais
Maxime Servais
User
Autor

Here is what I do : I upload my picture there

Leer más
Publicado en de Maxime Servais
Maxime Servais
Maxime Servais
User
Autor

And here is the result, it looks really nice (but it's not responsive...) is there a way to make it responsive? 

Leer más
Publicado en de Maxime Servais
Esahc ..
Esahc ..
Moderator

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")

Leer más
Publicado en de Esahc ..
Maxime Servais
Maxime Servais
User
Autor

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

Leer más
Publicado en de Maxime Servais
Paul M.
Paul M.
Moderator

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

Leer más
Publicado en de Paul M.
Incomedia
Claudio D.
Incomedia

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!

Leer más
Publicado en de Claudio D.