All Questions
111
questions
2
votes
1
answer
1k
views
Viewport meta tag in NextJS 14 app router with "shrink-to-fit=yes" issue
I'm trying to make my NextJS 14 app router application scale down on any device less than 500px width, as I'm making my app responsive down to 500px wide and anything below that I want it to scale ...
0
votes
0
answers
123
views
Meta tag not working to change address bar color's of safari desktop in dark mode
I want to change the color of my site's top bar address on Safari desktop. I firstly try to use CSS, but I quickly find the HTML meta tag "theme-color" with the media query "(prefers-...
0
votes
0
answers
31
views
OG image height and width are not applied to image, even though they appear in html
I have defined OG metadata, including images, for my Rails 7 website. I'm using the meta-tags gem to set the metadata.
When I use the Facebook debugger tool (https://developers.facebook.com/tools/...
0
votes
0
answers
476
views
Is it possible to have a meta tag for theme-color with content being a CSS variable?
I've got a WordPress child theme that I'd like to adjust the theme-color meta tag for, but I'd like to be able to change it via the GUI in future rather than jumping back into functions.php (and I don'...
0
votes
1
answer
506
views
Update `theme-color` when class/theme of page is toggled
I have a Javascript toggle that adds/removes classes on the html element to change the colour/theme of my page. 1st (no class) = white, the 2nd (.dark-mode) theme is black, the 3rd (.retro) is beige.
...
1
vote
0
answers
150
views
Dark and light mode not rendering correctly with the `<meta name="color-scheme" content="light dark" />` tag
I am building a personal portfolio website and i want to implement light and dark mode for accessibilty purpose but it is not rendering correctly.
I've followed a tutorial that use the prefers color-...
-1
votes
1
answer
551
views
meta tag theme-color is not working in reactjs
I want to change my chrome theme while visiting my site
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
...
0
votes
1
answer
833
views
How to make a button for the meta tag of light dark mode:
Is it possible to make a button to change the light and dark mode using meta <meta name="color-scheme" content="light dark">, but you can also use a button to change the mode?...
2
votes
1
answer
1k
views
Is Initial-scale=1 necessary to be included in <meta> viewport tag? [duplicate]
Most big development sites recommend using
<meta name="viewport" content="width=device-width,initial-scale=1"/>
And, according to a Mozilla doc on meta viewport tag, initial-...
2
votes
0
answers
882
views
What's the width of a screen? 100vw vs innerWidth vs visualViewport.width vs screen.width (React)
As you could imagine, I'm trying to make my webpage responsive and mobile friendly.
I have an outer container on which I set the width dynamically using this hook (window.innerWidth). So to test if ...
0
votes
1
answer
1k
views
display a play button over videos thumbnails in link privew [duplicate]
I am working on a video sharing platform, the platform automatically generates a thumbnail for uploaded videos and I use these thumbnails for the link preview on other sites but I want to add a play ...
2
votes
1
answer
586
views
<meta> not working when initial-scale is changed
By default, in the index.html file:
<meta name="viewport" content="width=device-width, initial-scale=1" />
I changed it to:
<meta name="viewport" content="...
2
votes
1
answer
556
views
Is a dynamic `theme-color` meta tag color possible?
I'm using Chakra UI with Next.js and wanted dynamically change the theme-color as user switches color modes.
Using variables do not seem to work.
<meta name="theme-color" content="...
0
votes
0
answers
33
views
Media query is not working when css is added
Here media query is not working when CSS is added. If I removed CSS then the media query is working fine. Here i commented the CSS uncomment and check. what might be the issue here Can anyone suggest ...
0
votes
3
answers
2k
views
Font Awesome showing boxes instead of icons
I was creating a web project, and until today I have been creating web projects on Android (Acode App). I always use font awesome in my projects, but this time I am on a PC running Microsoft Edge (I ...