Questions tagged [cross-browser]
Cross-platform development involves the process of creating websites, web applications, libraries, or components that are designed to work seamlessly on various web browsers and rendering engines.
Encountering a challenge with IE9 and jQuery. Click events on anchor tags function in Chrome, Firefox, and Opera, but fail to fire or have unexpected behavior in IE9. This issue only occurs upon the initial page load when the cache is empty. When clicking ...
After creating a simple SVG of a red circle to serve as the list-style-image for my website, I discovered the concept in this Stack Overflow response: The solution worked seamlessly across all browsers except Internet Explorer. In IE, the SVG image render ...
Is there a way to select two combined checkboxes with one click? I have a small calendar where I need to mark weeks using checkboxes. Since one week can fall into two months, I have created duplicates of the same checkbox for each week. Is there a safe wa ...
Would you mind checking this out? http://jsfiddle.net/UQNJA/1/ It displays correctly in all updated browsers, including IE7/8 and 9. However, in IE6, the red and pink borders do not contain the floated <li>s. Any suggestions on how to fix this issu ...
Building on the previous discussion about optimizing a horizontal sliding layout (Most efficient way to do a horizontal sliding layout), I'm curious if it's feasible to enable the back and forward buttons in the browser when implementing a single ...
Currently, I am experimenting with Modernizr for the first time and facing some challenges in adding a class to the HTML tag as per the documentation. To check compatibility for the CSS Object Fit property, I used Modernizr's build feature to create ...
I'm currently working on application development using ReactJs and Material UI. When I try to open the application in Mozilla Firefox, an error message pops up saying "TypeError: CSS2Properties doesn't have an indexed property setter for ' ...
As a beginner in node.js, my goal is to create an online chat platform that can handle 1000+ participants simultaneously. I am in need of a cross-browser demo that is compatible with IE7 and Android. My main concern is the client-side cross-browser functi ...
I am encountering an issue with running my angular2 app on Safari 9.1.2. It works fine on all higher versions of Safari as well as other browsers such as Chrome, Firefox, Opera, and Edge. However, when I try to run it on Safari 9.1.2, I receive the followi ...
CSS at-rules have been part of CSS since the days of CSS2. As CSS evolves with new specifications like @supports, it's interesting to see how different browsers handle unsupported rules. Do major browsers simply ignore unrecognized rules, or do they f ...
This is my first time seeking help on stackoverflow. I have been struggling to understand why the font on my website doesn't display correctly in Safari or any browser on IOS devices, even though it appears fine on Chrome, Firefox, and other browsers. ...
Disclaimer: I'm new to web design and development. I have encountered an issue with posting information from a form built on CodeIgniter using jQuery. The form posts successfully in Chrome and Firefox, with the current page automatically reloading. Howeve ...
Is there a way to incorporate an image icon into an input placeholder and have it disappear when the user starts typing, across all browsers? In trying to achieve this, I successfully implemented a solution for webkit (Safari+Chrome) using ::-webkit-input ...
The web application I am currently working on was developed approximately 10 years ago and is only compatible with Internet Explorer. My goal is to make it functional in Chrome as well. I am facing a challenge regarding the "text" property of IXMLDOMEleme ...
I haven't had a chance to test it on IE yet. My goal is to create a unique style for the background image and text box shape, along with borders, for the search bar on my website, [dead site]. If you check it out on Firefox or Opera and see the sear ...
I am experiencing issues with the design of a nested div element when viewed in the default Android browser. Unfortunately, I don't have access to tools that would allow me to identify the cause of this problem. However, the design functions correctly ...
I've been working on a timeline project where the completed sections should have a green background with a check mark image in the foreground. It appears correctly in Firefox, Chrome, and Safari. However, in IE 7 and 8 (and possibly 9), the layout is inco ...
Currently, I am attempting to convert an object into a string in javascript. After stringifying the object, I have noticed some discrepancies between different browsers. {"jobTypeArray":"[CONTRACT -W2]"} In Firefox and Chrome, the values appear as follow ...
I have a unique situation where I am integrating an angular directive into a dynamically-sized element. The directive itself is made up of an SVG which adjusts based on the size of the container. I am working on making sure the SVG automatically resizes an ...
When using the radio+label trick to style radio buttons, a peculiar issue arises in Internet Explorer 11 (IE11). The first and last buttons in each set appear to have their bottom parts cut off or shortened, depending on the background displayed. Removing ...
Currently, I am working on developing an application that demands the capability to upload large files. After much consideration, I have opted to utilize the FormData object as it allows me to provide progress updates to the user. Sadly, Internet Explorer ...
Is there a specific identifier for HTML tags on a webpage? I noticed Mozilla uses uid, but is it compatible with all browsers? (I'm not concerned about IE6...) I've come across Unique identifier for HTML elements but they didn't mention t ...
I need help troubleshooting why the fonts are not loading properly in the body section of my articles, specifically when viewed in Internet Explorer. Take a look at an example article here: I am fetching from this CSS file: , and I have included the nece ...
Here's a common CSS code for creating a CSS triangle: display: inline-block; vertical-align: middle; content: " "; border-right: 4px solid transparent; border-left: 4px solid transparent; border-top: 6px solid black; width: 0; height: 0; Click here ...
Can an API be called on multiple browser tabs simultaneously? For instance, in Tab A I make a call to the apple API with data A, and in Tab B I also call the same apple API but with data B. This means that the apple API in Tab A should ...
I've been working on a sticky header code, but I'm having trouble achieving a smooth scroll transition. The fixed header seems to jump after just one scroll. Here is the basic HTML structure: <div class="headerWrapper"> <div id="to ...
I have been working on a project that utilizes the most recent versions of Angular (version 5) and Bootstrap (4). However, after a few weeks of development, I noticed that some features are not functioning properly on Safari, and I am uncertain if all fea ...
Currently, I am attempting to produce a trapeze-like design utilizing various techniques in order to achieve the best possible outcome. The shape I am aiming to create is similar to this: (the content inside the shape will consist of images and text) Th ...
Check out the code snippet at http://jsfiddle.net/jN5G4/1/ Is there a way to align the drop-down menu for "5 Columns" to match the alignment of the other drop-downs? After removing the <a href...> </a> tags from the 5 Columns list item, the d ...
Recently, I created a dropdown menu using only CSS. The challenge was to have a horizontal bar of items that can each expand into a vertical menu. However, I wanted the expanded menus to display bulleted lists instead of tertiary menus. By nesting three ul ...
My username-password form is styled and working perfectly, but there's an issue that arises when I log in multiple times. Chrome automatically fills in my email, turning the username textbox yellow. It doesn't seem to happen with Firefox or Safar ...
Working on building an E2E test using NodeJS and TestCafe. We recently integrated BrowserStack for cross-browser testing, focusing on Windows7:firefox & Windows10:firefox. However, encountering failures only when running scripts in this specific confi ...
I am currently working on implementing drag-and-drop functionality in my project, utilizing slip.js from slip.js. To enhance the cursor during dragging, I have assigned class="draggable" to each draggable <tr>. The CSS code for this class is: .drag ...
When it comes to the new layout tags in HTML5, how effectively do they degrade? What risks are involved in using them? (I'm excluding <video>-- as I've come across specific fallback code for it). For instance, consider the following snippet: <ht ...
I have a group of checkboxes with an option for 'None'. When 'None' is clicked, it should uncheck the rest of the checkboxes in the set. If any other checkbox is clicked, 'None' should be unchecked. This functionality is working in IE8 but fails silently ...
JsFiddle CSS body, html { background: violet } * { margin: 0; padding: 0 } .fixed { height: 100%; width: 300px; background: #fff; right: 0; position: absolute; top: 0; display: -webkit-box; display: -moz-box; display: -ms-flexbox; ...
Imagine having the following code: var $element = $('<div/>'); $element.css("margin-left", "2cm"); console.log($element.css("margin-left")); When tested in Chrome, it doesn't return anything, but Firefox shows "75.5833px". Any sugges ...
Struggling with a tricky HTML cross-browser problem. The site was built by multiple people, making it quite messy, but needs to go live as soon as possible! Each of the 4 page layouts on the site are different and handled by separate classes. However, whe ...
I am looking to set up a basic test using Selenium and Cucumber for logging into my web application and confirming that the main page is displayed correctly. Currently, all three tests are returning true even before the page is fully loaded. The issue ar ...
I am currently developing a Vue project where I need to store variables in decimal numbers using point notation. For example, if I input 23,5 it should be saved as 23.5. function school (ind){ this['School Name'] = "", this['Subject 1'] = "56.6 ...
, you can find the following code: $("body").delegate('area[id=area_kontakt]','mouseover mouseleave', function(e){ if (e.type == 'mouseover') { $("#kontakt_tip").css('display','block'); } else { $( ...
Trying to design a web page with 3 sections, each occupying 100% of the window height. Managed to make it work on Chrome, Firefox, and Safari, but facing compatibility issues with IE8 and possibly other versions. Test out the page here: Here's the HTML s ...
My current project involves creating a portfolio showcasing my work, but I've encountered an issue: When you visit my website and click on the "About" link, the text at the bottom of the tab is displayed differently in Chrome compared to IE and Firefox. ...
Is there a way to determine if a web page has a horizontal scrollbar using jQuery or pure JavaScript? I need this information to dynamically change the css of another element. I initially tried function isHorizontalScrollbarEnabled() { return $(docum ...
I need assistance with running a test script on multiple URLs using both Chrome and Firefox browsers locally on my machine. Each browser must open all the specified URLs in the test script. I have successfully run the test script for multiple URLs, but I a ...
I am seeking advice on the best practices for testing object existence for cross-browser compatibility. There are numerous methods available for testing whether an object/function/attribute exists. While I could utilize jQuery or another library, my prefe ...
When an image cannot be displayed, what is the expected behavior of browsers? The information provided by official sources regarding this matter is intentionally vague. They mention that alt text should be utilized, but fail to clarify how it should be us ...
In my Katalon Studio script, I have a button click command that uses scrollIntoView to bring the button into view before clicking it. ((JavascriptExecutor) functiondriver).executeScript("arguments[0].scrollIntoView({block: \"nearest\"});", butto ...
While styling a drop down in Firefox on Mac OS X, I noticed that the arrow changes from the standard look to an unattractive downward arrow. How can I maintain the standard form element with the appealing up and down arrows, instead of the unsightly downwa ...
After creating the following CSS code for a div to always be positioned on the right: #button > .right { background-position: -268px 1415px; height: 180px; position: fixed; right: -90px; top: 40%; width: 263px; -webkit-transform ...
I'm facing an issue where my script is functioning perfectly on Firefox but not working on Chrome. The script code I am using is as follows, where "r_tour" is the id of the select element and "option" is one of the options: $("#r_tour option").click(func ...
Let's discuss an issue that is not related to block elements collapsing when their children are floated, and has nothing to do with clearing at all. Imagine having a set of floated divs like: <div class="column">Column 1</div> <div cl ...
I'm experimenting with HTML5/CSS3 for the first time and have implemented a cool little link to display a dialog (modal) on one of my web pages. While this works perfectly in Chrome/Firefox, it unfortunately doesn't function properly in Internet Explorer ...