Divider displayed between images in Internet Explorer 8

On my website, I have arranged four images in a square using the code below:

        <div id="tempo_main">

        <div id="tempo_content">
            <div style="text-align: center;z-index: 3;position: absolute;right:350px; left:350px; top: 305px; overflow: hidden;"><img alt="PW" src="/media/1001/prospectLogo.jpg" width="319" height="115" /></div>
<table width="100%" cellpadding="0" cellspacing="0" border="0" bgcolor="black">
    <tr>    
        <td align="right"><a href="/ourwines/whites.aspx" ><img src="media/1012/intro_3_Fade.gif" border="0" onmouseover="this.src='media/1013/intro_3_Original.gif'" onmouseout="this.src=src='media/1012/intro_3_Fade.gif'" height="250" widht="357" /></a></td>
        <td align="left"><a href="AwardsAccolades.aspx"><img src="media/1008/intro_1_Fade.gif"  border="0" onmouseover="this.src='media/1009/intro_1_Original.gif'" onmouseout="this.src=src='media/1008/intro_1_Fade.gif'" height="250" width="357" /></a></td>
    </tr>
    <tr>    
        <td align="right"><a href="/winery.aspx"><img src="media/1014/intro_4_Fade.gif" border="0" onmouseover="this.src='media/1015/intro_4_Original.gif'" onmouseout="this.src=src='media/1014/intro_4_Fade.gif'" height="250" width="357" /></a></td>
        <td align="left"><a href="#"><img src="media/1010/intro_2_Fade.jpg" border="0" onmouseover="this.src='media/1011/intro_2_Original.jpg'" onmouseout="this.src='media/1010/intro_2_Fade.jpg'" height="250" width="357" /></a></td>
        <td height="25"></td>
    </tr>   
</table>

I am currently updating an older site that was built over 5 years ago! While everything functions properly on Chrome, there seems to be a gap appearing between the images when viewed on IE8.

The image below illustrates the issue. The browser at the top is IE8 and the one at the bottom is Chrome. You can see the dividing line separating the top two images from the bottom two.

javascripthtmlcssinternet-explorer-8

Answer №1

There seems to be a margin being applied by the browser. One solution could be to eliminate any padding or borders from the image. It's possible that certain versions of Internet Explorer automatically added borders to images.

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

Can a 1D array be utilized to create a 2D grid in React?

I needed to display a one-dimensional array in a 2D grid format with 3 rows and 3 columns. The array itself contains numbers from 1 to 9. const array = Array.from({ length: 9 }, (_, i) => i + 1); In my React component, I have it rendering as a series o ...

javascripthtmlcssreactjs

Tips for preventing text wrapping in off-canvas design

Seeking advice for my Web Application prototype - looking to prevent text wrapping in off-canvas menu paragraphs using CSS or JS. New to building this type of menu, I used an example from W3Schools to achieve the current design. <!DOCTYPE html> ...

javascripthtmlcss

extract all elements from an array nested within another array

I am having difficulty extracting data from an array file in PHP. I was able to read it and convert it into a PHP array, but now I want to display the stored information in a table, however, I keep getting incorrect values. How can I retrieve the informat ...

javascriptphphtmlarrays

Could you please review my PHP code? I encountered a syntax error: unexpected '}' character. Thank you

I encountered an issue in the final line <?php } ?> as it reports a syntax error, unexpected '}' <?php if (isset($_SESSION['u_id'])) { //echo "You are logged in!"; include_once 'database.php&apo ...

phphtmlcss

Running a child process within a React application

I'm currently in search of the best module to use for running a child process from within a React application. Here's what I need: I want a button that, when clicked, will execute "npm test" for my application and generate a report that can be r ...

javascriptreactjsnpmchild-process

how can I modify the css style of an html element only when a specific sibling is present?

After searching through the MDN CSS documentation, I was unable to find any Combinators that can target the specific element I want to style. /* second-span red when first-span is present */ [first-span] ~ [second-span] { color: red; } /* firs ...

htmlcss

Spacing between the rows of a table

I am seeking to achieve a unique visual style for the rows in my table, similar to the one shown below. I attempted to use CSS border properties in the code snippet provided but desire more spacing between each row with a thin border and sharp edges. .dat ...

cssangularbootstrap-4ngx-datatableborder-spacing

Encountering an issue with the message: "Property 'ref' is not available on the type 'IntrinsicAttributes'."

Having trouble implementing a link in React and TypeScript that scrolls to the correct component after clicking? I'm using the useRef Hook, but encountering an error: Type '{ ref: MutableRefObject<HTMLDivElement | null>; }' is not assi ...

javascriptreactjstypescript

Ways to retrieve the most recent state in a second useEffect call?

Currently, I am encountering a situation where I have implemented two useEffect hooks in a single component due to the presence of two different sets of dependencies. My challenge lies in the fact that even though I update a state within the first useEffec ...

javascriptreactjsreact-hooks

What is the process for retrieving data from a form input field?

I am currently working on a form that will dynamically populate with data from a database. Here's how it is supposed to function: the user inputs the company number, and then the form queries the database to see if the number exists. If it does, the c ...

javascriptphpajaxformsinput

Issue with Guild Member Add functionality in discord.js is not functioning as expected

I'm facing an issue with my code where the bot does not send a welcome message when a user joins, despite having everything set up correctly. Even when a user leaves, there is no farewell message being sent either. Here is the code I am using: bot.on ...

javascriptnode.jsdiscorddiscord.jsbots

Using npm as a build tool to merge files together

Upon discovering the flexibility of using npm as a task runner instead of gulp or grunt, I have successfully implemented various tasks such as linting, stylus processing, jade compilation, uglifying, and even watching files. However, I am facing difficulti ...

javascriptnode.jsnpmconcatenation

SoundCloud authentication failed because the sign-in callback is attempting to access a frame from a different origin

Latest SoundCloud SDK Version About a year ago, I successfully registered my App. To my surprise, today I found that the SoundCloud (SC) sign-in feature is no longer working. Upon clicking the button, a SC pop-up window appears with the message "Allow ...

javascriptangularjssoundcloudangularjs-1.6

What is the best way to enhance the class following this condition in JavaScript?

Initially, the original script worked perfectly with just one class being added: function check_btn_charge() { if (parseInt(jQuery(".total-change-price").text()) >= 0) { jQuery(".btn-action-save-charge"+"&nbsp;"+"btn-danger" ...

javascriptjquerycssclass

Is the hidden element still viewable even with display: none?

Can you explain why the icon is still visible when the display is set to none? .toc.item { display: none; } <a class="toc item"><i class="sidebar icon"></i></a> ...

htmlcss

How to make an AJAX request in jQuery / JavaScript after a specific time interval has passed

Here is the code snippet I'm working with: $('input.myinput').each(function(){ var id = $(this).val(); var myajax = function(){ $.ajax({ url: ajax_url, type: "GET", data: ({ code: id ...

javascriptjqueryajaxforms

Searching for matching strings in jQuery and eliminating the parent div element

Here's an HTML snippet: <div id="keywords"> <div id="container0"> <span id="term010"> this</span> <span id="term111"> is</span> <span id="term212"> a</span> <span ...

javascriptjqueryhtml

What is the best way to transform object request data into a string in an Express application using Node.js

I am trying to save the request data from app.get('/') to a variable, but I keep getting an error "TypeError: Converting circular structure to JSON". var express = require('express') var app = express() var bodyParser = require('b ...

javascriptjsonnode.jsexpressobject

using async.waterfall with async.apply

Here is a code snippet that I am working with: async.waterfall([ // Read directory async.apply(fs.readdir, '../testdata'), // Load data from each file function(files, callback) { async.each(files, loadDataFromFile, callback); } ], ...

javascriptnode.jsnode-async

What is the correct way to apply styles universally instead of using "*" as a selector?

With Nextron, I was able to successfully run my code, but upon opening the window, I noticed that the body tag had a margin of 8px. Although I managed to change this using the dev tools, I am unsure how to permanently apply this change in my code. When att ...

javascriptcssnext.jselectron