Hi,
I was wondering whether it is possible to turn off Viewports bar during a page design phase. The issue I'm having is that all elements of a page during development are being adjusted to insure proper positioning in terms of rows padding. However the same page does not look the same if a website is accessed through the frontend. It seems that the Viewports bar, which is give or take is about 40 px, once is not there, screwing all row positioning - https://rb.gy/e7x9oi.
Thank you
Hi
Thanks for contacting us. Could you please give me your site URL so that I can check?
-Regards.
https://joomla4.bostonholistichealing.com
Hi, In case you need to login, please check hidden area for the login info. Thank you
Did you use any custom CSS on that portion?
Yes, I've used custom CSS to format page's title -
@media (min-width: 320px) and (max-width: 767px) {
font-family: 'Maven Pro';
text-align: center;
font-size: 22px !important;
line-height: 26px !important;
font-weight: 600;
}}
Use this custom CSS
#sp-page-builder .page-content .sppb-section:first-child{
padding-top: 1px !important;
}Path towards custom CSS: Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.
Provided code did solve the margin issue for About Me page, thank you, however there are over margin issues I have on practically every page. Please see the following example - https://tinyurl.com/mw8nhuc5.
Could you please give me that specific page link?
https://joomla4.bostonholistichealing.com/services/reiki-healing-and-reiki-training Also, magrins of the background video used on this page are off as well
It seems like this on my end
This seems to become like another love affair... I just opened this page in both Chrome and Edge and they both display information, not a blank page as captured in your screenshot. The buttom line is that margins on all of the pages are out of whack between design mode and live view without Viewports Bar being there. I provided you with login info, so if there is a true desire to help solve the issue, I think someone from the development team could login and investigate.
Could you please give me a screencast of your issue?
Please use the following link - https://tinyurl.com/h3jsv2wn. Just to ensure that I communicated my issue correctly, the viewport bar used during the development is 40px, once I run the site live, all the padding / margins I configured during the design get shifted.
When you delete my CSS is this working?
Sorry, I'm not sure if I understand your question? Custom CSS you've provide me with is being used and its working for about me only page.
I'd like to move on going live with Joomla 4 implementation, however since margins on practically every page of all rows / objects in design vs live are off, I can’t. I’ve provided you with screenshots, videos and login info, however the issues I’m having weren’t resolved (with exception of About Me page). So the question is, would you be able without asking me any additional questions about my problems get to the bottom of it? If you can’t or won’t, just tell me, so we’ll stop playing a ping pong game.
Sorry for this inconvenience. Its better you can create a new forum post about this new section.
But why? What's wrong with the current post? There is no new section. Like I’ve mentioned previously, you have everything at your disposal to dive into the identified issues. This post is open for almost two weeks now and it seems that I need somehow to prove that the issues I’m reporting truly exist. People who post on this forum are trying to resolve their issues because of Page Builder bugs or “features”, and lack of support is simply amazing.
Here is yet another illustration on how video resizes in the design mode vs frontend.
You can try one thing. Just remove this CSS and then check.
#sp-page-builder .page-content .sppb-section:first-child {
padding-top: 1px !important;
}Remove this one. It conflicts that part.
Removing this CSS does adjust the video background for mobile to almost the same height as I would expext it. However header of the About Me page, gets moved up. Reviewing the rest of the pages I also noticed that the latest SPPB update messed up font sizes and other positioning. I need to work on adjusting everything. At this point in time it looks like that the issues I'm having can't be resolved.