Hey Guys, I need some help:
In past versions of Web Builder, responsive design has always worked really well for me. In Web Builder 15, however, it's a mess! Probably because of the new options to "Activate when smaller than device width and Activate when larger than device width" options.
Here is my setup:
Default View is set to a width of 1024px
I have a second breakpoint for mobile set to 320px
I have set "Activate when device width is larger"
My laptop with a screen resolution of 1920x1080 is displaying the mobile version of the website - and it's a mess.
My Samsung S8 phone is displaying the mobile version correctly.
Website can be found here: www.archipelago-resort.com (All the other pages in the site have not yet been optimized for mobile, so they show properly on computer)
How do I get laptops, desktops and netbooks to display the default view correctly? Somehow in previous versions it just worked. I'm using quite a few layers - and I understand that layers don't display correctly in mobile view until you create a copy and hide the objects from the default view. I've done all that.
Responsive Design Not Working Properly
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: Responsive Design Not Working Properly
I cannot see what you have done based on HTML code, but it looks like you have placed a slideshow on a full width layer.
This is not correct because the rest of the layout is not flexible, so this will cause overlaps.
Note that this is unrelated to version 15, it's just not the right way to do it.
If you want to create flexible/full width layouts then use layout grids instead.
Related tutorial:
http://wysiwygwebbuilder.com/layout_modes.html
If you need further assistance then I need a copy of your project file, so I can see what you have done.
This is not correct because the rest of the layout is not flexible, so this will cause overlaps.
Note that this is unrelated to version 15, it's just not the right way to do it.
If you want to create flexible/full width layouts then use layout grids instead.
Related tutorial:
http://wysiwygwebbuilder.com/layout_modes.html
If you need further assistance then I need a copy of your project file, so I can see what you have done.
-
-
- Posts: 6
- Joined: Thu Jan 11, 2018 10:25 am
Re: Responsive Design Not Working Properly
I'm trying layout grids instead, but hate them, because I can't resize them manually, and objects inside cannot be re positioned where I want them? Am I missing a setting?
Re: Responsive Design Not Working Properly
Correct, because the size is determined by the available space. That is the whole point of flexible design.I can't resize them manually,
Objects in a layout grid are floating so the position depends on the grid settings and order of the elements.objects inside cannot be re positioned where I want them?
The problem with your layout is that you have parts flexible and parts fixed. That will cause a conflict.
A flexible object (like your slideshow) will dynamically adapts it's size but the rest of the layout doesn't because it has a fixed size/position.
Related tutorial:
http://wysiwygwebbuilder.com/layout_modes.html