IT ENGLISH BOARD

RESPONSIVE DESIGN TROUBLES

Author
author
Date
2020-07-16 21:51
Views
1588

I've read the articles but I'm having a hard time with smaller viewports than the desktop.




No problem with desktop but when work down to smartphone everything gets screwed up.

I lose my images, I lose my menu for the desktop and more.

Does anyone have a step by step guideline on how to work down throught the viewports without screwing up the desktop. Yes, I save constantly after every change.

I used the copy and paste for the section and structure but after that I'm a mess.

Please advise.

Dennis

Total Reply 2

  • 2020-07-16 21:52

    For the Header and Footer, you need to set up and position all of your elements (the menu, images, text, etc.) separately within EACH viewport.

    You cannot just set up the desktop view and automatically expect all the Header and Footer elements to automatically locate themselves properly.


  • 2020-07-16 21:54

    Dennis, if you delete an object in any resolution it is deleted in all resolutions (there is a warning message), this also applies to font sizes. However, if you resize or reposition an object this affects ony the current resolution. Keep in mind the title object will allow you to scale content by simply resizing the object.

    If you can not use an existing object at or below a specific resolution you can hide it for "this and lesser resolutions"

    If you now add an object (eg an alternative menu object) it will only display at that and lesser resolutions.

    Perhaps a screen shot of template content at desktop and another at the lesser resolution with a problem might help us help you?


Total 104
Number Title Author Date Votes Views
73
Website not working in smartphone view   (6)
author | 2020.07.16 | Votes 0 | Views 1365
author 2020.07.16 0 1365
72
LiveChat Object. How to add a chat
author | 2020.07.16 | Votes 0 | Views 1362
author 2020.07.16 0 1362
71
RESPONSIVE DESIGN TROUBLES (2)
author | 2020.07.16 | Votes 0 | Views 1588
author 2020.07.16 0 1588
70
How to check the correct functioning of a responsive Website using the local Preview
author | 2020.07.16 | Votes 0 | Views 1367
author 2020.07.16 0 1367
69
How to change Header and Footer
author | 2020.07.16 | Votes 0 | Views 1374
author 2020.07.16 0 1374
68
How to manage the contents of a responsive website
author | 2020.07.16 | Votes 0 | Views 1500
author 2020.07.16 0 1500
67
How to set up a redirection according to the device resolution
author | 2020.07.16 | Votes 0 | Views 1331
author 2020.07.16 0 1331
66
How to correctly report the Desktop and Mobile URLs in the page code
author | 2020.07.16 | Votes 0 | Views 1509
author 2020.07.16 0 1509
65
How to create the Desktop and Mobile versions of a website
author | 2020.07.16 | Votes 0 | Views 1362
author 2020.07.16 0 1362
64
How to create a Responsive Website
author | 2020.07.16 | Votes 0 | Views 1382
author 2020.07.16 0 1382
New