Pablo,
First layout grid on my page is set to 100vh and looks good in firefox, chrome and edge.
Safari does not scale layergrid to 100vh. How can I fix this?
Safari does not scale layoutgrid to 100vh
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: Safari does not scale layoutgrid to 100vh
What is the URL of the page?
Re: Safari does not scale layoutgrid to 100vh
Its not finished yet, but here You can see the page I am having proplem with:
/link removed/
/link removed/
Last edited by piotrh on Tue Aug 11, 2020 9:32 am, edited 1 time in total.
Re: Safari does not scale layoutgrid to 100vh
It seem to work correct for me.
Maybe you have an older version of Safari?
Note that this is a standard HTML feature, so it's not up to WWB whether or not it works.
Maybe you have an older version of Safari?
Note that this is a standard HTML feature, so it's not up to WWB whether or not it works.
Re: Safari does not scale layoutgrid to 100vh
Im using last avalible safari build for windows. This might be the reason.
I have no option to check this on mac, but if You say its looks ok – I'ts fine for me
.
Thank You
P
I have no option to check this on mac, but if You say its looks ok – I'ts fine for me
.Thank You
P
Re: Safari does not scale layoutgrid to 100vh
I have another problem with this page:
this time its how it is displayed on my tablet. When my tablet is in portrait orietation it displays my 780px breakpoint and its fine.
In landscape position it displays my default page - but it does not scale my background to cover the view (as it does correct on desktop computer).
How can I fix this?
/link removed/
this time its how it is displayed on my tablet. When my tablet is in portrait orietation it displays my 780px breakpoint and its fine.
In landscape position it displays my default page - but it does not scale my background to cover the view (as it does correct on desktop computer).
How can I fix this?
/link removed/
Last edited by piotrh on Tue Aug 11, 2020 9:33 am, edited 1 time in total.
Re: Safari does not scale layoutgrid to 100vh
There is no fix, some mobile browner just do not support this functionality.
See also:
https://caniuse.com/#feat=background-attachment
(known issues)
See also:
https://caniuse.com/#feat=background-attachment
(known issues)
Re: Safari does not scale layoutgrid to 100vh
Is there a way to have a layer as fixed, not scrollable background to trick this issue?
Re: Safari does not scale layoutgrid to 100vh
Not as far as I know.
Re: Safari does not scale layoutgrid to 100vh
Hello Pablo,
I found out simple fix that seems to work fine on my mobile device.
I put height: 100vh; here:
body
{
background-color: #FFFFFF;
background-image: url(images/big7pat2.jpg);
background-attachment: fixed;
background-position: center center;
background-repeat: no-repeat;
height: 100vh;
background-size: cover;
color: #000000;
font-family: Arial;
font-weight: normal;
font-size: 13px;
line-height: 1.1875;
margin: 0;
text-align: center;
}
I do it manually after page export. Is there a way to do this inside WWB?
P
I found out simple fix that seems to work fine on my mobile device.
I put height: 100vh; here:
body
{
background-color: #FFFFFF;
background-image: url(images/big7pat2.jpg);
background-attachment: fixed;
background-position: center center;
background-repeat: no-repeat;
height: 100vh;
background-size: cover;
color: #000000;
font-family: Arial;
font-weight: normal;
font-size: 13px;
line-height: 1.1875;
margin: 0;
text-align: center;
}
I do it manually after page export. Is there a way to do this inside WWB?
P
Re: Safari does not scale layoutgrid to 100vh
You can add custom code in the Page HTML.
Re: Safari does not scale layoutgrid to 100vh
Yes, but I tried and there seems to be no way to place it so I can style body element... Like here:
<!doctype html>
<html height: 100vh;>
<head>
<meta charset="utf-8">
<title>Untitled Page</title>
<meta name="generator" content="WYSIWYG Web Builder 15 - http://www.wysiwygwebbuilder.com">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body
{
background-color: #FFFFFF;
background-image: url(images/big6.jpg);
background-attachment: fixed;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
height: 100vh;
color: #000000;
font-family: Arial;
font-weight: normal;
font-size: 13px;
line-height: 1.1875;
margin: 0;
padding: 0;
}
<!doctype html>
<html height: 100vh;>
<head>
<meta charset="utf-8">
<title>Untitled Page</title>
<meta name="generator" content="WYSIWYG Web Builder 15 - http://www.wysiwygwebbuilder.com">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body
{
background-color: #FFFFFF;
background-image: url(images/big6.jpg);
background-attachment: fixed;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
height: 100vh;
color: #000000;
font-family: Arial;
font-weight: normal;
font-size: 13px;
line-height: 1.1875;
margin: 0;
padding: 0;
}
Re: Safari does not scale layoutgrid to 100vh
You can put styles between the <head> tags.
Code: Select all
<style>
body
{
height: 100vh;
}
</style>