Apple iPAD problem

All WYSIWYG Web Builder support issues that are not covered in the forums below.
Forum rules
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901

MUST READ:
http://www.wysiwygwebbuilder.com/getting_started.html
WYSIWYG Web Builder FAQ
User avatar
Pablo
 
Posts: 12644
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Apple iPAD problem

Post by Pablo » Sat Jan 13, 2018 9:52 am

'Max width' does not work in breakpoints.

As a workaround you can try this code between the head tags of the Page HTML:

Code: Select all

<style>
#FlexBoxContainer1 {
    margin: 0 auto 0 auto !important;
}
</style>

User avatar
alex4orly
 
 
Posts: 486
Joined: Mon Jan 20, 2014 8:17 am
Location: Australia
Contact:

Re: Apple iPAD problem

Post by alex4orly » Sat Jan 13, 2018 7:58 pm

OK, I have in the meantime removed the "max width 300" , that on its own placed the Blog object in the center of the screen on my Android phone
After inserting the code you suggested, I do not see any difference in the display, what was this supposed to change?
How do I "modify the flexbox properties"? to make the blog object flexible...

Thanks again

User avatar
Pablo
 
Posts: 12644
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Apple iPAD problem

Post by Pablo » Sat Jan 13, 2018 10:20 pm


User avatar
alex4orly
 
 
Posts: 486
Joined: Mon Jan 20, 2014 8:17 am
Location: Australia
Contact:

Re: Apple iPAD problem

Post by alex4orly » Sun Jan 14, 2018 1:51 am

Hello again,

Following the tutorial , I setup the following: http://www.beleuramyhome.org.au/page5.html

1) A layout grid with one column in it, in the middle of the page.
2) Inside that Flexbox - on the left the iFrame for display, on the right - my Blog object.
2) Flexbox settings - Flex direction : row, wrap, Flex start, Flex start, stretch. Size : undefined, Position : Floating

BUT - when I resize the browser horizontaly to mimic a mobile device, it doesn't react and the Blog objects dissapears from view, instead of behaving like this : http://www.beleuramyhome.org.au/videoclips.html (Layout grid with a iFrame in each column)

I expect this to behave the same as the above link to : videoclips.html

But obviously - either not possible or I am doing something wrong here....

Cheers

User avatar
alex4orly
 
 
Posts: 486
Joined: Mon Jan 20, 2014 8:17 am
Location: Australia
Contact:

Re: Apple iPAD problem

Post by alex4orly » Sun Jan 14, 2018 8:05 am

Whil you had a rest (from me...) I downloaded the sample project of the Flexbox and realized that I should NOT have it inside a Layout grid...
This is my latest result : http://www.beleuramyhome.org.au/page5.html
Compared with the original (LIVE page) : http://www.beleuramyhome.org.au/videoclips.html
I have two problems:

1) The iFrame on the left has fixed size and doesn't adjust itslef to the Mobile phone (The LIVE page does), and
2) The Blog objects takes its width from design mode and is not as wide as the Mobile screen (The LIVE page does)

What / how can I fix this?
Thanks

User avatar
Pablo
 
Posts: 12644
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Apple iPAD problem

Post by Pablo » Sun Jan 14, 2018 8:16 am

You will need to set the flex grow/shrink to 1 (for example), to make the object flexible.

User avatar
alex4orly
 
 
Posts: 486
Joined: Mon Jan 20, 2014 8:17 am
Location: Australia
Contact:

Re: Apple iPAD problem

Post by alex4orly » Sun Jan 14, 2018 8:49 am

OK, I set the Flex for the iFrame to 1 / 1 as instructed and that look fine : http://www.beleuramyhome.org.au/page6.html
BUT, if I do the same for the Blog Object - it automatically splits the page / FlexBox into two equal parts which is NOT right for visitos on Desktop.
And also, I am NOT clear - what should be the setup for
Flex Basis and Align Self ????
Can the Blog Object be adjusted with any of those 2?

User avatar
Pablo
 
Posts: 12644
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Apple iPAD problem

Post by Pablo » Sun Jan 14, 2018 10:38 am

And also, I am NOT clear - what should be the setup for Flex Basis and Align Self ????
I recommend to leave the default settings.

I cannot see what you have done based on the HTML code only.
I need your project file to be able to give you more useful advise. Before you share your project please remove all non-relevant content from the project, so I do not have to go through hundreds of pages/settings to figure out what you have done.

User avatar
alex4orly
 
 
Posts: 486
Joined: Mon Jan 20, 2014 8:17 am
Location: Australia
Contact:

Re: Apple iPAD problem

Post by alex4orly » Mon Jan 15, 2018 7:53 am

OK, I finally got it - Thanks to Pablo once again.
It seems however that the tool that I can control better the layout - is Layout grid, not FlexBox
So here is the final page : http://www.beleuramyhome.org.au/page1.html

What I have here is the following : One Layout grid in th emiddle with 2 columns
The left column has in it an iFrame with two different height settings, one for PC or a Tablet, the other one shorter for Mobile phone.

In the Right column of that Layout grid - I inserted a FlexBox with Zero pedding, zero margins and the setup is
Row, nowarp, flex-start, flex-start, center
Inside it I plugged my Blog Object with Flexbox setting of 1,1,30%, center

That final setup of the Blog object achieves a proper view for bot a tablet in portrait and lanscape as welll as for mobile phone in portrait. In mobile phone landscape, it works but doesn't look fantastic... But I can't have it all...

Now, to the next challenge

Thanks again Pablo

Post Reply

Who is online

Users browsing this forum: No registered users and 4 guests