Return to previous page

Problems at 768px of width - by designerobot

This topic has 6 replies, 2 voices, and was last updated 6 years, 7 months ago ago by Rose Tyler

designerobot

Participant

August 13, 2017 at 21:33

Hi,

From settings in “Theme Options -> Custom CSS” we can see that the theme has different layouts according to the width of the page, namely:
– desktop: 992px +
– tablet: 768-991px
– mobile landscape: 481-767px
– mobile: 0-480px

I discovered that all work fine, but not when the width is exactly 768px (like for example on the iPadMini4 or the iPadAir2 where the resolution is 768x1024px).

In this case, the layout is not chosen in the right way and the layout change continuously.

I noted this thing on my website (the link is in pvt content) both on the homepage and in portfolio:

– in my home page, I have two blocks of img/text, one visible only in desktop version and another only in the mobile version (thanks to the specific option in Visual Composer). At the 768px width the system doesn’t recognize the right version and change continuously;

– in my portfolio page, all works fine until I don’t use some buttons of the filters… in this case the layout of the page changes (due to the pixels added from the insertion of the scroll-bar, I suppose).

See the short movie in the link below to understand what happens exactly at 768px of width.

I noted also other strange things at this precise resolution… therefore, my question for you is: can I change the boundary from “tablet and mobile landscape”?

Now it is 768, but if I set it to 748 (namely 20px less) maybe I could avoid all these problems on the iPads.

To do this, the new settings should be
– desktop: 992px +
– tablet: 748-991px
– mobile landscape: 481-747px
– mobile: 0-480px

How can I do this?

Please, contact administrator
for this information.

#169949 Copied

5 Answers

Rose Tyler

Support staff

August 14, 2017 at 09:50

Hello,

It is strange problem. Did you check this situation on real device? Very likely this problem appears only in emulator.

Regards

#169976 Copied

designerobot

Participant

August 14, 2017 at 15:03

Hello, thabks for you reply.
No, I don’t have this device in real now to test it. But I tested with deskopts with other browsers (Safari, Chrome, Firefox, Ms Edge) and operating systems (both on Mac Os 10 and on Windows 10) trying to set the windows at 768 px of wight and the problem is present. There are a few pixels (less or more) around the boundary of 768 where the problem is still present.
Changing the boundary of the working modes maybe solve the problem. What do you think? Could be it hard to try it?

#170006 Copied

Rose Tyler

Support staff

August 15, 2017 at 10:55

Hello,

We checked the page on real IPad device and there is no such problem
If you want to change media query you may use child theme, note that this query requires additional customization in theme files and is out of our basic support scope.

Regards

#170086 Copied

designerobot

Participant

September 4, 2017 at 11:15

Hi, ok many thanks.
I’ll keep it in this way if you say that on a real iPad it works fine.

PS: could you remove the link to the screenshot of my website in the previous reply. It’s still work in progress and I would like it is not visible yet because probably it will change.

#171520 Copied

Rose Tyler

Support staff

September 4, 2017 at 13:18

Hello,

Ok. Feel free to ask if you have any other questions.

Regards

#171526 Copied
Viewing 6 results - 1 through 6 (of 6 total)