I've been tweaking one of my sites and have discovered something unexpected when breakpoints are reached when resizing the browser width. The whole site has just one single breakpoint at 768 px, where it changes to a mobile friendly, portrait layout. I added the same breakpoint in the body text style, where the font size and line spacing are reduced. The issue is that the text change comes into effect at 970 px, and then the rest of the resizing happens at the expected 768 px. I can't see why there is a change at 970 px, any ideas?
This is the site https://www.seans-hab-sauce.de
Advice needed
Sean
Breakpoint Issue
Forum rules
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901
MUST READ:
http://www.wysiwygwebbuilder.com/respon ... esign.html
Please read this first before posting any questions! Also check out the example project to get an idea how the RWD concept works.
Responsive Web Design FAQ:
http://wysiwygwebbuilder.com/forum/view ... 10&t=63817
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901
MUST READ:
http://www.wysiwygwebbuilder.com/respon ... esign.html
Please read this first before posting any questions! Also check out the example project to get an idea how the RWD concept works.
Responsive Web Design FAQ:
http://wysiwygwebbuilder.com/forum/view ... 10&t=63817
Re: Breakpoint Issue
Maybe this will be helpful?
"When do I use 'Activate breakpoints when browser window is larger than the device width'?"
https://wysiwygwebbuilder.com/forum/vie ... 10&t=63817
"When do I use 'Activate breakpoints when browser window is larger than the device width'?"
https://wysiwygwebbuilder.com/forum/vie ... 10&t=63817
Re: Breakpoint Issue
I see 2 media query codes. One at 960px and one at 768px. I think what Pablo mentioned has something to do with it. Otherwise, please share a demo project.
Re: Breakpoint Issue
I changed it to 'activate breakpoints when browser window is smaller than the device width' and this fixed it when previewing the site, but after publishing, it still acts in the wrong way. I've cleared history, refreshed and even deleted all of the online content and republished it, but I get a different result than that in the preview.
Re: Breakpoint Issue
There is no difference between previewing and publishing. The same files are generated. Make sure you clear your cache with a hard refresh contol-f5.
Re: Breakpoint Issue
I realise the files are identical but it is definitely not working as it should on the live version. I've just tried it on my desktop, laptop and TV computer and the result is the same. I've cleared everything, as well as ctrl-F5 but no joy.
Could you check it on your browser and let me know what happens between 970px and 768px?
Could you check it on your browser and let me know what happens between 970px and 768px?
Re: Breakpoint Issue
Did you make sure breakpoints are the same for all pages?
Re: Breakpoint Issue
Yes, all have a breakpoint of 768.
Re: Breakpoint Issue
You said it works in preview. If that is the case and its not working after you publish it, then it means there could be some file that didnt get updated on the server. Maybe delete the html file, css file on the server and re-upload it.
I will check out your update shortly when I get to my computer.
I will check out your update shortly when I get to my computer.
Re: Breakpoint Issue
I've fixed the problem. The default page width was set at 970, at first I just removed this but it was automatically replaced with a width of 768 (the same as the breakpoint). I then changed the default width to 1920, with a breakpoint at 768 on every page, and it works as expected now.
I'm happy that it works now but still puzzled why the preview and live version behaved differently. Anyway, thank you to you both for your help. I'm very grateful that you are always around
I'm happy that it works now but still puzzled why the preview and live version behaved differently. Anyway, thank you to you both for your help. I'm very grateful that you are always around