The centered div feature is not supported in Internet Explorer 8

My Tumblr theme works flawlessly on Chrome, but when I switch to IE, the alignment goes haywire. Internet Explorer seems to shift everything to the right, especially when hovering over images and opening them in permalink pages. I've tried various solutions, but nothing seems to work...

Check out my Tumblr page:

http://nolnspiration.tumblr.com/

And here is the code snippet:

<!DOCTYPE html>
<head>
...
{CustomCSS}
</script></body>

Answer №1

For optimal performance, consider using IE9. -ms-transform:translateX(100deg); /* IE9 */

.LikeReblogButton{
    webkit-transform: translateX(50%);
    -moz-transform: translateX(50%);
    -ms-transform:translateX(100deg); /* IE9 */

    transform: translateX(50%);
    vertical-align:middle;
    width: 300px;
    height:100%;
    display:table-cell;
}

Answer №2

The jquery_backbone_lodash-modern.js script is not functioning properly in Internet Explorer 8.

I have discovered that document.addEventListener is not supported in browsers older than IE9.

Typically, the workaround is to use attachEvent for IE versions before IE9. Check if addEventListener is defined and use attachEvent if it is not.

Source: addEventListener not working in IE8

EDIT:

Looks like everything is already sorted out. But this was the issue I encountered with IE:

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How can recursion be implemented when the items are interdependent?

I am looking to create a function that can generate a list of individuals upon whom a specific person relies. The complexity here lies in the fact that these individuals may, in turn, rely on the original person. To illustrate: const people = { ' ...

Tips for dynamically loading a different favicon with each page load in React

Is there a way to dynamically change the favicon on every page reload in React? I have a collection of icons and I want one to be randomly selected each time the page refreshes. The code for loading favicons in the manifest.json file is as follows: " ...

Fetching data from a database for Vue.js using the Summernote editor

I previously inquired about integrating summernote with vue.js and received a helpful response here. It worked seamlessly with v-model binding. However, I encountered an issue when attempting to load data from the database for an edit page. The data was n ...

SQL queries can be used in Node.js to fetch data from various tables and display it on an HTML page

I have a problem with my expressjs app where I am trying to count records from multiple tables in a database and display the results on separate divs in HTML. Currently, the code is functional without any errors, but I am encountering an issue where the sa ...

Reset form upon submission

When submitting a form and adding the contents to an array, I encounter an issue where the item added to the array remains linked to the form. How can I add the item to the array and then clear the form, similar to using jQuery's reset() function? Be ...

How can we send a JSONArray through a dynamically generated button event and then retrieve the elements of the JSONArray?

In the following SCRIPT code snippet: var jsonArr = [ { " name": "John", "age": 31, "city": "New York" }, { "name": "Smith", "age": 25, "city": "Dubai" } ]; function create() { createButton(jsonArr); } function cre ...

Encountering an issue when utilizing a personalized directive with AngularJS

I'm encountering an issue with the "auto-complete" directive that I'm using from jsfiddle. The error message I'm receiving is iElement.autocomplete is not a function. Can someone help me troubleshoot and fix this error? directive.js starte ...

What is the best way to position text and an image within a div container?

Essentially, I am dealing with two blocks of text along with an accompanying image. <div class="container"> <span class="title">Some Text</span> <img src="an_image.png" /> <span class="note">Additional Text</sp ...

Show the image on top of the div block as the AJAX content loads

Implementing this task may seem easy and common, but I am struggling to figure it out! What should take five minutes has turned into an hour of frustration. Please lend me your expertise in getting this done. I have a div container block: <div cla ...

Implementing dynamic AngularJS functionality within an older HTML structure using JQuery

I am facing an issue while trying to load dynamic content using AngularJS. In my system, I have legacy pages that utilize JQuery for dynamic loading. However, as I am developing new features with AngularJS, I am encountering the same problem with dynamic ...

What is the best method for extracting attribute values from multiple child elements using puppeteer?

When using this code, I can retrieve the attribute value of the first element selected. By adding /html/body/section/div[3]/img<2> or img<3> in the xpath, I am able to retrieve data for subsequent img elements. However, the parent element on t ...

Create a separate child process in Node.js

Is it possible to create a separate process from the current script? I want to execute another script while the original one is still running. This new script should be completely independent of the calling script. ...

The ASP.NET controller parameter in jQuery datatable is consistently returning as null

Looking for assistance with my JavaScript function... function loadTable(date: string) { $('#myDataTable').DataTable({ "bServerSide": false, "sAjaxSource": "Date/GetValuesFromDate", "data": date "bAutoWidth": false, "bProce ...

Accessing All Items in SharePoint Lists with Display Templates

I am on a mission to retrieve every single item from all lists within a SharePoint site. Despite my efforts, the resources I have come across explain how to fetch all lists or all items from a list, not every item in all lists within a site context. My co ...

Ensuring the container height remains consistent with fluctuating content dimensions

Imagine a container with content, where the container's width is fixed but its height adjusts based on its inner content. Initially, when the content causes the container to be a specific height, the challenge arises in shrinking the inner elements w ...

What is the best approach for maximizing user experience: setting a maximum screen width or allowing for auto-width?

I manage a blog with responsive design that adjusts to the width of the screen. The majority of our blog posts consist of lengthy content, often reaching over 1000 words, along with user comments. My main concern is about the reading comfort and usability ...

Insufficient width of images in the bootstrap carousel

Is there a different solution to this problem that hasn't been mentioned in the other posts? I've tried all the top solutions from those posts, but my issue still remains. In particular, the "example" code and "Stock" bootstrap carousel appear t ...

Guide to showcasing the most recent search history results upon clicking the search button in vuejs?

My JavaScript file is displayed below: <div v-bind:class="{'open':openSuggestion}" class="search-bar"> <input class="form-control bg-light-blue" id="SearchText" type="text" v-model="search" @keydown.enter = 'enter&ap ...

What can you do to prevent a div from taking up the entire page if its height is not specified?

Currently, I am experiencing an issue with my layout. I have a hidden div with a fixed position that becomes visible when a button on the page is clicked. Inside this div, there is a table of buttons for the user to choose from. The problem arises when I ...

Effective Strategies for Preventing Javascript Injection Attacks

My main concern is distinguishing between client-side messages originating from my code and those coming from a potential hacker. Despite researching JavaScript injection and reading various responses on StackOverflow, the consistent advice is to never tru ...