9,061 questions
1
vote
1
answer
50
views
CSS calc() differs in Samsung/Firefox vs Chrome/Edge
I’m working with the following code:
<div style="--w: 30px;"></div>
And I’m testing two expressions:
Test Case 1
calc(30px / 720px * 100vw)
Test Case 2
calc(var(--w) / 720px * ...
1
vote
0
answers
46
views
How to get CJK orthography to display well in browsers?
<style>
* {
font-family:
"PingFang SC", "Hiragino Sans GB",
"Noto Sans CJK SC", "Noto Sans SC",
"Microsoft YaHei", "WenQuanYi Micro Hei";
}
#two {
font-variant-...
0
votes
1
answer
76
views
Detecting In App WebViews in GTM: Filtering Android/iOS WebViews from Browser List
We are trying to accurately detect whether a user is viewing our customers site through an in-app WebView (like Android WebView or Safari in-app) versus a normal browser. The goal is to filter in-app ...
1
vote
1
answer
127
views
PDF link opens to exact page on Windows but not on mobile or tablet
I’m using a link to open a PDF file hosted on SharePoint (or any other web location) and I want it to open directly at a specific page.
For example:
https://example.com/myfile.pdf#page=5
On Windows ...
0
votes
0
answers
52
views
Firefox and Safari renders a gap around SVGs while resizing the window. Chrome is working fine
I want to enclose the viewport with two SVG images, each covering 50% of the space, leaving no gaps between or around them. Chrome renders this correctly, but Firefox and Safari display small gaps ...
0
votes
0
answers
40
views
Is browser pixel pipeline and DOM diffing being used always together in React.js when updating CSS when using state vs updating CSS imperatively?
When working with React.js - does the browser behave differently in the pixel rendering pipeline when we update CSS declaratively -like through state in event handlers:
<div className={isDark ? '...
1
vote
1
answer
124
views
File input click not opening dialog in Microsoft Edge despite successful API calls
Problem Summary
File input <input type="file"> click events are not opening the file selection dialog in Microsoft Edge, despite the same code working perfectly in Safari and other ...
0
votes
0
answers
97
views
How to customize the CompositionEvent UI in JavaScript for IME keyboard logic on various browsers?
I just encountered What is JavaScript's CompositionEvent? Please give examples From the little images/videos available on the topic, and given that I only ever really use a English/Latin keyboard ...
0
votes
0
answers
75
views
How to prevent font-weight synthesis on Chome for local fonts 'SimSun' and 'MS Gothic'?
I am on Windows 11, so both SimSun and MS Gothic are installed by default and don't contain bold glyphs.
I test the CSS property font-synthesis-weight as follows:
body {
font-family: sans-serif;
...
0
votes
1
answer
138
views
Enter Key Not Working with <datalist> in Edge Browser
Problem Statement
When using the <datalist> element in an input field in Microsoft Edge, pressing the Enter key does not trigger any event while the datalist options are displayed.
Steps to ...
1
vote
1
answer
90
views
Should the `<html>` element height always be >= the height of the `<body>` element?
As an example:
html {
height: 100%;
background-color: yellow;
border: 5px solid black;
}
body {
min-height: 100%;
background-color: green;
}
div {
height: 120dvh;
}
<div>
...
0
votes
0
answers
77
views
Where do you report IIS ASPX page generation errors?
Using the same ASPX form and variables from the same Azure Cloud Service IIS server, the results page returned to iOS Edge/Safari instances of those browsers report an error but from a Window's Edge ...
1
vote
0
answers
92
views
Why MUI Drawer Not Rendering in Safari and Web Gnome but Works in Firefox, chrome and Edge?
I Tested Enlite Starter and its demo → In the template settings, the first sidebar does not show again after closing it. The drawer renders and works perfectly in Firefox, chrome and Edge but in Web ...
0
votes
0
answers
104
views
How to reliably detect Firefox to handle window closing behavior differently from Chrome?
I'm working on a web application where I need to detect if the user is on Firefox because it behaves differently when closing a specific window compared to Google Chrome. Right now, the codebase uses ...
0
votes
1
answer
67
views
aspect-ratio not affecting parent size on ios/webkit
I'm applying the aspect-ratio CSS property to the children of a container. The children are being appropriately sized. However, the children's parent is not being sized to fit it's content.
This seems ...
0
votes
0
answers
37
views
How to consistently get beforeunload navigation type
I need to clean some data (sessionRelevantData) in IndexedDB when users leaves the last tab of my React app. To do so, I implemented a counter on localStorage to get the number of opened tabs and when ...
0
votes
1
answer
210
views
Aspect ratio inside grid display works different in Chrome and Firefox
Using grid layout and setting aspect ratio for some child is not calculated correctly in Firefox, the column does not expand and the child overlaps that column.
<div class="parent">
...
1
vote
0
answers
125
views
Date Parsing Issue in Edge Browser Causing Invalid Date Error
const StartDate1 = new Date().toLocaleString();
const currentResponse = await commonAPI.apiname();
const pStat = {
PageID: '4',
MethodID: 60,
...
0
votes
1
answer
42
views
Blank space in Firefox but not in Chrome in injected span
In the context of a web extension, I am injecting a button in a text node. It works on Chrome but on Firefox, I have some weird long blank in the injected span (between the button and the next comma).
...
-1
votes
2
answers
87
views
Deployed React App not loading on Laptop Browsers
I have deployed a React Web App on Azure Static Web App using the free tier with my custom domain. I am able to react the site perfectly fine from mobile devices which includes safari and google ...
2
votes
0
answers
45
views
Problem with overlapping inputs for Price Slider on FireFox
Right now my price slider works great on chrome, safari and edge, but on firefox, even though I've made specific adjustments, one of the sliders appears to be under the other one, causing it to be ...
-2
votes
2
answers
77
views
Do all international browsers display the exception STACK in English or in the browser's native language?
This question is NOT about translating the content of a web page. It is about the Exceptions thrown in the JavaScript engine.
I am wondering if all international installations of browsers, installed ...
2
votes
1
answer
74
views
What is the correct browser behaviour when you have CSS shorthands in combination with individual shorthand constituents?
Consider the following code.
a {
text-decoration-color: red;
}
.oops{
text-decoration: underline;
}
code {
border: 1px solid rgb(0 0 0 / 0.2);
padding-inline: 0.5em;
}
<p>This <...
0
votes
2
answers
99
views
URL API behaves differently in Edge
When I'm trying to use native URL API for validation purposes, surprisingly, Edge browser behaves differently. So the input of:
const myUrlString = "abfss://myprojectname/filename.csv";
const ...
0
votes
1
answer
32
views
event.originalEvent.propertyName not working in any none Chromium browsers
jQuery
$('body > header').on('webkitTransitionEnd oTransitionEnd msTransitionEnd transitionend', function(event) {
if (event.target && event.originalEvent....
0
votes
0
answers
354
views
Use the offscreen API with webextension-polyfill
I'm trying to upgrade to Manifest version 3 a cross-browser extension that uses webextension-polyfill and Typecript. I'm stuck on trying to do something similar to https://developer.chrome.com/docs/...
1
vote
0
answers
79
views
.AspNetCore.Cookies is not shared from Visual Studio debug mode into another browser window
I use authentication .AspNetCore.Cookies cookie. If I run the asp.net core web from VS in debug mode, the authentication challenge is started and I need to log in. After login the .AspNetCore.Cookies ...
0
votes
1
answer
150
views
How to get a uniform backdrop blur effect?
When applying a backdrop-filter blur the result differs in uniformity between different browsers:
From left to right: Safari, Chrome, Firefox
With respect to uniformity, Safari is doing best, ...
2
votes
0
answers
234
views
Redirect Instagram Story Link to Open in Default Browser on Android for Amazon App Redirection
I'm working on a system with the following goals:
Create a short link that points to an Amazon product URL.
When someone clicks this link, it should ideally open directly in the Amazon app if it's ...
0
votes
0
answers
177
views
Blend mode is not working on IOS browsers
I'm experiencing an issue with the CSS property mix-blend-mode: color; on iOS devices. It works correctly on Windows and Android, but it doesn’t seem to have any effect on iOS browsers. If anyone has ...
4
votes
3
answers
253
views
Why is an unsupported CSS value still overriding its fallback declarations? [duplicate]
I set up some CSS rules like:
.example {
color: white;
background-color: darkgray;
background-color: var(--bg-color);
background-color: rgb(from var(--bg-color) r g b / 0.5);
}
in the ...
0
votes
1
answer
144
views
Play sound notification when browser tab is inactive
Motivation: Let's assume that I have a marketplace. Let's assume that user posted advertisement/poster and went to other website to read something or watch. Still, he would like to receive sound ...
0
votes
1
answer
71
views
Overflow difference between Chrome and Firefox browsers
I have this project I've been working on as part of a roadmap to web development, and I developed this sidebar that has an inner scrolling list. In Chrome, the inner list scrolls, but in Firefox, each ...
0
votes
1
answer
108
views
Relative horizontal alignment on text when `writing-mode: vertical-lr;`
When working with the CSS style writing-mode: vertical-lr; and two different languages font, my text would get aligned to the left side of the kanji on Chrome, but to the right side on Firefox.
This ...
0
votes
1
answer
65
views
Set button for input time is not displayed
Given this HTML snippet:
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/chota.min.css" rel="stylesheet"/>
<form>
<label for="time" class="form-label">Set time</...
0
votes
1
answer
176
views
Unable to handle native popup on iOS/Chromium in Selenium tests
I'm running Selenium WebDriver tests on iOS using Chromium in BrowserStack, and I keep encountering a native popup when I submit a form that says:
"The information you're about to submit is not ...
0
votes
1
answer
109
views
Pure-CSS perspective parallax effect only works on Firefox and not on Chrome or Safari
I tried making a webpage where backgrounds scroll a bit slower than the text content, giving an illusion of a 3d scene, but my method only works on firefox. On chrome and safari any transform property ...
0
votes
0
answers
73
views
SVG not rendering properly in IOS safari browser using React Native Web
I have application made on React Native Web. I have a SVG Component Which is rendered correctly in new ios and android device browser. But in some IOS ( 12, 13, 15 ) it is not rendering.
When I ...
0
votes
0
answers
82
views
iPhone 15 safari browser switch event trigger
It is possible to trigger an event eg browser or profile switch or incognito mode by using the volume up and power buttons in iOS ?
Something is happening when she does this but I can’t pin it ?
I ...
0
votes
0
answers
96
views
Prevent a device from going to sleep when browsing a web page [duplicate]
I would like to prevent the device going to sleep while looking at my web page. I would like this to work for chrome and safari on both ios and andriod.
I have currently researched 2 possible options ...
0
votes
1
answer
167
views
Share local storage between site 'x' in a tab and the site 'x' inside an iframe of another site 'y'
Currently my site has a local storage key call isLoggedIn which is set to true after login. when the site is again opened in another tab then the new tab will also be logged in using the local storage ...
14
votes
1
answer
3k
views
How to 'polyfill' `interactive-widget=resizes-content` for meta viewport tag on iOS Safari?
Chrome added support for interactive-widget=resizes-content in v108. Firefox also seems to support this as of writing (though it doesn't work correctly in fullscreen).
The resizes-content value makes ...
3
votes
0
answers
1k
views
Mailto Link Not Working Consistently Across All Browsers, Specifically in Google Chrome
I'm experiencing an issue with a simple mailto link in my web application. The link is intended to open the user's default email client to send an email. The HTML code for the link is as follows:
<...
0
votes
1
answer
93
views
Unable to trigger selenium scripts on selenium grid, working on local
I am running selenium python script through Selenium Grid, but it throws error
selenium.common.exceptions.WebDriverException: Message: Unable to find resource, invalid path in url."
Below is ...
0
votes
1
answer
64
views
setZoom not working in Chrome but is working in other browsers
I am unable to get setZoom or any of the zoom features to work on my leaflet map in Chrome.
It works fine in Firefox and Edge but I need it to work in Chrome also and cannot find anything on this.
Any ...
2
votes
2
answers
2k
views
WakeLock API not working in Safari (iOS) but working in Windows/android platform with same code
I want to enable wake lock API. It is working fine with Windows platform and android devices but not in Safari or iOS devices.
Console has error NotAllowed, Permission was denied in Safari Browser.
I ...
-1
votes
1
answer
160
views
Css range slider compatibility
I am making a website that has 2 separate range sliders using html, css and javascript. I am having real difficulty getting the range slider to work for CHROMIUM.
I have spent hours searching and ...
2
votes
1
answer
525
views
Transparency Issue with WebM Videos on Android Chrome Browser
The transparent WebM video, which appeared crisp on the Chrome browser on PC, shows jagged edges on the Android Chrome browser. Specifically, the edges of fine details like animal fur appear darker, ...
0
votes
0
answers
111
views
HTML Signature font Rendering Issue: Apple Mail Overrides Font-Family on Gmail Web Client
I'm facing an issue where the font-family styling applied to text elements in an HTML email signature is being overridden when the email is sent from the iPhone's Apple Mail app to a Gmail web client. ...
1
vote
1
answer
74
views
CSS Flip Card Scroll Issue in Firefox: Scrollbar Appears but doesn't work with mouse wheel
If I made a flip card like the one here flip_card, but and made the front-card and the back-card scrollable then the scrolling via mouse wheel only works with the back-card and the front-card only ...