Topic: Mobile looks different on all browsers « SeaTheme

This topic has 10 replies, 2 voices, and was last updated 6 years, 5 months ago by linalina.

Viewing 11 posts - 1 through 11 (of 11 total)

Author

Posts
December 15, 2019 at 12:53 am #20177

linalina
Participant

Purchased
Expired

This is how it looks on Safari & Chrome: https://ibb.co/KNwKwtZ
This is how it looks on Brave & Firefox: https://ibb.co/1JTkY3b
This is how it looks if i just resize my browser on desktop: https://ibb.co/BZNJHtJ

Is it possible to have them all looks same – preferably as the first image, Safari & Chrome?
Also: I would like to have a Scroll Down on mobile as well, and currently it is missing.

Here’s the website: http://www.linazaitceva.com/cruelty-free-app

WordPress Customization Service from $49 Only! Save your expensive time!

December 15, 2019 at 4:57 am #20178
SeaTheme
Keymaster

Purchased
Expired
Hi,

Please paste the custom CSS code to “Appearance > Customize: Additional CSS”
```
@media (max-width: 768px) and (orientation: portrait) {
 .responsive-ux .fullscreen-wrap.post-cover, .responsive-ux.single-portfolio-fullscreen-slider .fullscreen-wrap {
    height: 100vh;
 }
}
```
Regards!

SeaTheme – SeaTheme.net – Twitter – Facebook
WordPress Customization Service from $49 Only! Save your expensive time!

December 15, 2019 at 11:40 am #20180

linalina
Participant

Purchased
Expired

Hi,

Thank you for your reply. It did fix it for Brave & Firefox mobile, however now, when I start scrolling down, the image does a weird zoom in. Please refer to the video: https://streamable.com/45ppx

Also, let me know if it’s possible to add a Scroll Down on that Featured Image for the mobile.

Thanks

WordPress Customization Service from $49 Only! Save your expensive time!

December 15, 2019 at 3:02 pm #20186
SeaTheme
Keymaster

Purchased
Expired
Hi,

What’s browser and system the issue(show on video) is happened on?

Also, let me know if it’s possible to add a Scroll Down on that Featured Image for the mob

Plz add the custom CSS:
```
.touchevents #ux-slider-down {
    display: block;
}
.touchevents #ux-slider-down:before {
    -webkit-transform: translate(2px,-15px) rotate(-60deg);
    -moz-transform: translate(2px,-15px) rotate(-60deg);
    -ms-transform: translate(2px,-15px) rotate(-60deg);
    transform: translate(2px,-15px) rotate(-60deg);
}
.touchevents #ux-slider-down:after {
    -webkit-transform: translate(2px,-12px) rotate(60deg);
    -moz-transform: translate(2px,-12px) rotate(60deg);
    -ms-transform: translate(2px,-12px) rotate(60deg);
    transform: translate(2px,-12px) rotate(60deg);
}
```
WordPress Customization Service from $49 Only! Save your expensive time!

December 15, 2019 at 4:44 pm #20189

linalina
Participant

Purchased
Expired

Firefox & Brave

WordPress Customization Service from $49 Only! Save your expensive time!

December 16, 2019 at 2:32 am #20195
SeaTheme
Keymaster

Purchased
Expired
Hi,

It is caused the address bar on ios.
https://medium.com/@susiekim9/how-to-compensate-for-the-ios-viewport-unit-bug-46e78d54af0d

Plz fix it by the custom CSS
```
 @media (orientation: portrait) {
.fullscreen-wrap.post-cover { 
    height: auto;
    padding-top: 177.7%;
	 }
}
```
WordPress Customization Service from $49 Only! Save your expensive time!

December 16, 2019 at 7:18 pm #20203

linalina
Participant

Purchased
Expired

Hi,

Great, that has fixed it. However, it made the image height too much and now it goes off screen, together with the Scroll Down. I have tried changing height: 100vh; to height: 80vh; but no results.
Picture: https://ibb.co/PQ1XQMz

WordPress Customization Service from $49 Only! Save your expensive time!

December 17, 2019 at 5:49 am #20208

SeaTheme
Keymaster

Purchased
Expired

Hi, you could decrease the padding-top: 177.7%
The height will not work.

WordPress Customization Service from $49 Only! Save your expensive time!

December 17, 2019 at 7:13 pm #20216

linalina
Participant

Purchased
Expired

That works, however the zooming in issue comes back

WordPress Customization Service from $49 Only! Save your expensive time!

December 18, 2019 at 2:14 am #20217
SeaTheme
Keymaster

Purchased
Expired
Remove the custom CSS:
```
@media (max-width: 768px) and (orientation: portrait) {
 .responsive-ux .fullscreen-wrap.post-cover,
.responsive-ux.single-portfolio-fullscreen-slider .fullscreen-wrap {
    height: 100vh;
 }
}
```
WordPress Customization Service from $49 Only! Save your expensive time!

December 18, 2019 at 9:29 am #20222

linalina
Participant

Purchased
Expired

Perfect. Thank you for your help.

WordPress Customization Service from $49 Only! Save your expensive time!
Author

Posts

Viewing 11 posts - 1 through 11 (of 11 total)

You must be logged in to reply to this topic.