How to show pop up page in bootstrap studio

hello guys. maybe it’s a silly question but i got stuck in that point.

i created page which is connected to a button and it opens as a popup page and not as ordinary page (not listed as page). u is actually a div. that div is on the overview list, but i can’t seems to visually see it on the main window layout. it is not hidden on the overview’ and don’t have the hide icon (eye) next to it.

how can i toggle to see that hidden element?

thank you

it’s the div called #about

Screen Shot 2022-07-13 at 6.11.57

It’s hard to know what you’ve done wrong without seeing your site or code.

Divs are not pages. A <div> is a tag for an HTML element that denotes a section or container on a page. If the contents of your div do not have some sort of explicit sizing, the div may not be visible.

What is in your Custom Code component?

thank you for replying. the costume code is a simple close button.
the div itself is not a page, i know it, but it act as one. as i said, it function like a popup page with a scale of 100vh/w on both. here is the code, i hope it’s sufficient.

I see in the CSS for your .about class you have display: none;

I would guess this is why you’re not seeing your div.

Also, you’re using “about” as both the class and ID on the same div? That seems odd.

If you want me to investigate this further I will need to see the actual website. Can you upload it and post the link?

(PS - It seems like you’re trying to overlay your entire page with a container? Wouldn’t it be simpler to just use a modal and modify the sizing?)

LOL, i must have spent to many hours at night not seen this. thank you for your help. it was obviously the initial ‘display none’ situation. by the way, i wasn’t aware of the modal component. sure it would have saved me some time.

thank you again.

You should probably bite the bullet and read through the entire Bootstrap website so you can familiarize yourself with all the stock components Bootstrap offers. In the long run, it will probably save you time since you won’t be accidentally “reinventing the wheel”, so to speak.

PS - I noted in your image that there are a lot of inline styles. You should try to move as many of those inline styles as possible into an external stylesheet. There is also a lot of redundancy in your styles. For example, there’s no need to have an inline style of margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0; when you can simply have, margin: 0; or even margin: 0,0,0,0; In fact, you don’t even need to write any CSS at all. You can just add a Bootstrap utility class of m-0 via the Attributes panel. Learning all the utility classes is time well spent.

Thank you for your help Printninja. i’m learning BSS bits by bits, has it is not my main occupation.but i’m getting improved thou.