I have designed a new website at , however, I am facing issues with my CSS on Internet Explorer 11 (version 11.608.15063.0). The font-face and dropdown menu are not displaying correctly. Can anyone assist me with this problem?
I have designed a new website at , however, I am facing issues with my CSS on Internet Explorer 11 (version 11.608.15063.0). The font-face and dropdown menu are not displaying correctly. Can anyone assist me with this problem?
Truetype fonts have historically had some issues with Internet Explorer. While they should be supported from IE9 onwards, it appears that a special bit needs to be set to make the font "installable", as explained in this response.
If you're facing this issue, one solution is to convert your fonts to the .eot format and use them as a fallback for IE. Here's an example of how you can do this:
@font-face {
font-family: 'Noyh-Geometric';
src: url('fonts/Noyh-Geometric.eot');
src: url('fonts/Noyh-Geometric?#iefix') format('eot'),
url('fonts/Noyh-Geometric.ttf') format('truetype'),
font-weight: normal;
font-style: normal;
}
It's likely safe to skip the line with the ?#iefix ending, as it was mainly relevant for IE6-8, as explained here. Feel free to give it a try and let me know if you found this information helpful.
Why does clicking on an anchor tag temporarily change the background of other tags that weren't clicked? What am I doing wrong? https://i.stack.imgur.com/ZKlUT.png Check out the code below: <nav class="navbar navbar-expand-lg navbar-light bg- ...
It seems like my button text appears fine on Safari, but in Google Chrome the issue arises. When you first arrive at the button, everything looks okay. However, after navigating through more posts and encountering the load more button again, the text gets ...
Having an issue where I'm trying to display all my components on the home page, such as service, about, and contact pages, but only the home and footer are currently visible. Below is the code snippet from App.js where I've set up the routes for ...
Recently, I took on a coding challenge from Frontend Mentor (this one) and managed to complete it successfully. However, the grid I designed is not fully responsive. It only adapts correctly when the page width matches the media query specifications. The c ...
Hey everyone, I'm sure we've all encountered this issue before and can agree that it's pretty annoying. Does anyone have a solution for removing the white space from select boxes? <select> <option> testing </option& ...
As a first-time GatsbyJS website builder, I am working on creating reusable components for my site. One of these components is the footer, and I have already structured it. Now, I have a dilemma - I want to change the color of a specific <div> within ...
The webpage layout I am currently experiencing issues with can be found at the following link: When viewing this page in ie7 or ie8 Compatibility View mode, a strange horizontal scrollbar appears whenever I hover over one of the menu items. It seems that ...
I'm currently working on creating a mouseover effect for my PHP elements within a store. My goal is to have a transparent div appear over the dynamically generated PHP sections. I have set it to display block mode to test its functionality and positio ...
My website seems to be having compatibility issues with Microsoft Edge. While everything works fine on Chrome, the navbar classes "navbar-light" and "bg-light" do not apply properly in Edge, and the font style defaults. I am using Bootstrap 5 and webfonts ...
I'm encountering an issue while trying to convert HTML/CSS to ASP.NET. In the original HTML, the icons were arranged in a single row of four icons, and for mobile devices, they were displayed in 2x2 rows. When I attempted to copy and paste the HTML wi ...
Hello, I am currently using inline JS in my Wordpress navigation menu, redirecting users to a login page when clicked. However, I have been advised to use a regular menu item with a specific class and then target that class with JS instead. Despite searchi ...
Hey there! I am looking to create a unique HTML hierarchy drop-down menu. It will have multiple levels or options, with each option having the potential for child nodes. When an option has child nodes, an arrow will appear next to it. Clicking on this ar ...
Currently working on a project www.codepen.io/anon/pen/yMmjZb The problem I am facing is with my 3rd row (the one with the 3 columns) where the background color is bleeding beyond the intended boundary. My suspicion is that it's due to the row span ...
I am trying to retrieve the value of max-height from a different source (such as vue data:) and then apply it to the navigation section of the b-tabs. I understand that I can create a CSS class and assign it to nav-class in order to modify the style of the ...
I'm having trouble with aligning my sidebar vertically between the header and the bottom of the browser window. Currently, the bottom items are extending beyond the browser's bottom edge. How can I adjust this to ensure proper alignment? Here is ...
Currently, I am in the process of converting React js to typescript. The component being used is a Class Component. I would like to obtain CSS settings through props and apply them to an element. How can I resolve this issue? render(){return( <span st ...
Greetings to the Stack Overflow community, Unfortunately, I encountered a compatibility issue with Internet Explorer when utilizing the jQuery library along with Ajax. The problem at hand can be observed in my live demonstration: Try sorting the items i ...
I have been experimenting with using a sprite and CSS3 animation to create a rollover effect. While it seems to be working in CODA 2, I'm encountering issues when testing in Mozilla, Chrome, Safari, and Opera as the animation fails to trigger. /*link ...
My requirement is to have a simple text link that triggers a browse-window opening. The idea is that when users click on certain words (such as 'upload an image'), a browser window appears allowing them to select and upload an image of their choo ...
I am having trouble adding a class to my JavaScript script in order to animate the images created in JavaScript to fall off the page. I have tried using the code element.classList.add("mystyle");, but every time I insert it, my JavaScript stops working. T ...