On this page: hidden link
Using Gutenberg, I need to fix the map on the right. Now doing this directly to the map wont work, it breaks it.
So adding a div around the map and then css I was hoping to sort this issue however this isn;t working either
We have done this already using Elementor and trying to do the same using Gutemberg
hidden link
Hi Pete,
Thank you for waiting.
During troubleshooting, I was able to force the map's column to stay fixed at the right side of the screen, using the following custom CSS:
@media only screen and (min-width: 768px) {
.kt-row-layout-inner > .kt-row-column-wrap > .inner-column-1 {
width: 63%;
}
.kt-row-layout-inner > .kt-row-column-wrap > .inner-column-2 {
width: 33%;
position: fixed;
right: 0;
}
}
I hope this helps and to check the CSS code applying to different page elements, you can use Google Chrome's inspect element tool, as explained in this guide:
hidden link
regards,
Waqar
No, many...many thanks fro your time 🙂
Works like a charm, perfectly. Really grateful for your help.
I really didn't think it would be possible to use this layout with Gutenberg and I spent over half a day rtying different CSS, nothing worked.
Again, thank you sooooo much for your help.
Regards, Pete
You're very welcome Pete and glad that it worked.
Please feel to mark this ticket as resolved and start a new one for each new question or concern - we're here to help!
My issue is resolved now. Thank you!
