I’m embedding a Glide app within my app using the Web embed element. Is there any CSS that would allow the embedded app to be full screen instead of in that narrow section for content?
I understand the basics of CSS, but would need some pretty specific direction! Thanks.
I assume you’re on a Business/Enterprising that allows embedding a Glide app within another Glide app?
Yes! I have it embedding correctly, I’d just like to make it full screen.
Oops, I really meant to ask about making the embedded app full WIDTH (not screen). The app seems to go to the width of any glide content, and I’d like it to go full width.
I’d also like the height to match the screen so there aren’t TWO scroll bars (one within the embedded app and one on the larger app).
Thanks!
I dont have a business plan where I can experiment with embeded Glide Pages, but if you use any other website, I assume that is not full width as well?
Nevermind, I understand. The web embed component only shows part of the website and then if scrolling is enabled, it gives the scrollers. So you’re more looking for full height and width essentially.
From my experiment with a normal website (I used https://resy.com), if viewing live, you’ll see the full page width wise without scrolling (Desktop will show Desktop version and Mobile will show mobile version. However, like any website, you’ll need to continue scrolling down to view all the content.
I found this HTML element that currently has overflow: hidden auto; I disabled that and it turned the vertical scroll bar off on the page my web embed is on
So you want to remove the vertical scroll bar and the padding on the left and right?
I don’t think I have a better recommendation than this.
I add my web-embedding into a container and then add a CSS class to it.
.wideEmbedded>div>div>div>div>div>div>div{
padding: 0px;
}
This gets rid of the white border one either side of the embedding and uses the full width of the screen.
Hope it helps
I assume this is for the new Glide Apps, and on Business/Enterprise?
