Post #1608653

2026-04-14 10:35 UTC

You confirm there is no way to conditionally in CSS make an element a (native) popover ? Aka if i want my navigation to be displayed in a popover menu on small screens and not on bigger screens I need tl have two navs html in my html? #WebDev

Replies (3)

@mensrea@freeradical.zone 2026-04-14 10:47

@tixie@mastodon.guerilla.studio you should be able to. wouldn't setting the popover display in a container or media query do?

Open ##2313291
@mugentoki@mastodon.social 2026-04-14 11:01

@tixie@mastodon.guerilla.studio It's definitely possible! Media queries, depending on the desired screen size -> that's your condition https://www.w3schools.com/css/css_rwd_mediaqueries.asp Then: position: static/fixed/sticky; Depending on what kind of popover you want. (Or static to disable the popover again) https://www.w3schools.com/css/css_position.asp

Open ##2313295
@amber@front-end.social 2026-04-14 14:09

@tixie@mastodon.guerilla.studio actually I just did this on my site. I'm running a small bit of JS to add the popover attribute to my menu when it gets down to mobile size. You don't need to dupe your nav.

Open ##2313296