View Image with Border in Internet Explorer and Firefox

I am experiencing an issue where Firefox and IE display a white border around images in print preview. The webpage consists of two divs, each containing an image with a width of 400px, within a container div that is 800px wide. While using print preview, I do not want the white border between the two images that appears. This does not happen in Chrome. Am I making a mistake somewhere?

Despite trying to use this code for print CSS, I have had no success:

<style type="text/css" media="print">
.test{float:none;display:inline;  border:none;}
img{border:0;}
</style>

The HTML code is as follows:

<!DOCTYPE html>
<html>
<head>
<style type="text/css" media="print">
.test{float:left; display:inline; border:none;}
</style>
</head>

 <body>
 <div style="width:800px;margin:0px auto;">
 <div class="test" style="float:left;width:400px;">
 <img src="1334300111712.jpg">
 </div>
 <div class="test" style="float:left;width:400px;">
<img src="1334300115318.jpg">
 </div>
  </div>
</body>

</html>

Answer №1

Here is a suggestion for your CSS:

img { border: 0; }

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

Extract the URL from the query parameters and inject it into a div element

I am currently working on a project to create an ASPX page with two separate div's. The first div will have static content, while I want the content in the second div to be dynamic. Users should be able to input a URL as a query string, and that URL s ...

Adjusting the minimum width of columns in Bootstrap can impact the responsiveness of your design

Upon upgrading from Bootstrap 4.4 to 4.5, I noticed a change in the responsiveness of cards within columns on my website. Previously, these cards would adjust accordingly when the screen size was smaller, but now they seem to overlap each other. This issu ...

Incorporate your own unique logo into Highchart graphs

Can custom logos or images be added to the graphs? I attempted to modify the credits label, but didn't succeed. $('#container').highcharts({ credits: { text: 'remisture.no', href: 'http://remisture.no&ap ...

Clipboard information inserts arbitrary line breaks into text

Whenever I attempt to retrieve data from the clipboard using event.clipboardData.getData('text/html'), the resulting HTML includes line breaks that are not supposed to be there. Here is the current output: <p class=Tabeltekst style='ms ...

Angular ng-repeat app not functioning as intended due to a lack of complexity

Seems like I've stumbled upon a rather silly issue here and it might be a duplicate question, but I'm still scratching my head over it. I have this incredibly basic Angular app along with some HTML. While debugging in Chrome, I can clearly see ...

The connection between an HTML form and PHP is not being established

variable-passing.php `<form method="post" action="variable-catching.php"> <input type="text" name="name1"/><br/> <input type="text" name="name2"/><br/> <input type="text" name="name3"/><br/> <input type="te ...

Arranging icons using CSS and HTML

I've experimented with various CSS methods to align the icons with the text, but I'm facing an issue where the icons seem slightly shifted upward from the text baseline. Here is how I target the icons: /* Styling for the full-height sidebar ...

Utilizing AJAX to submit a combination of text fields and files in an HTML form

Just starting out with AJAX and JQuery, I'm curious if it's possible to send data from an HTML form, including a text file and two separate text boxes, via an AJAX request. So far, I've managed to send the data from the text boxes but not th ...

Is there a way for me to display a gif similar to 9GAG on my

I'm looking to implement a feature on my website that allows me to pause and play a gif, similar to the functionality on 9gag. Can anyone provide guidance on how I can achieve this? I understand that I need to use both .jpg and .gif files, but my at ...

Unpredictable characters within CSS class titles

I've observed an interesting pattern on certain websites like tray.io, asana, and Facebook. When you inspect their CSS class names, you may come across random combinations of characters, such as: <header class="Header_XSDsdksdXKkSDD">..</Hea ...

Issues related to looping through li tags using jQuery and PHP

Trying to retrieve the text of the <li> elements using jquery and php, but facing an issue where only the first value for each <li> is being alerted when clicked. <?php foreach ($query->result() as $row){ // gene ...

center commotion excitement vessel vertically

I am facing a dilemma once again and could really use a helping hand. I have created an exciting animation that I have placed within a Bootstrap 4 tab, but I'm struggling to center it vertically. Is there someone out there who could help me out? Tha ...

Verify the accurate sequence for arranging the items in the drag and drop list

I am currently developing a Language learning platform that includes several web applications. I am still new to javascript and struggling to find a solution for one of my apps. This specific app involves draggable list items that need to be arranged in t ...

Persistent hover effect for collapsible accordion panels when closing them

My simple accordion features a functionality where a class of .open is added to the title + content group when you open a panel for styling purposes. Everything works smoothly, but I've noticed on my phone that after clicking to close a panel, the hov ...

When a button is undersized, the click event may not register

In my angular application, I have developed a directive for a tinyMCE editor. Upon setup, I have implemented two handlers: one for the blur event to hide the toolbar and another for the click event to show it. Additionally, I have created another directive ...

Using CSS, you can utilize a three-dot pattern to create a unique X

Hey there! I've got a menu with three dots that animate, and when I click on them, I want them to transform into an X shape. You can check out the demo here: demo Here's the HTML: <div class="dots"> <div class="dot"></div> & ...

Unable to locate the module specifier "three". Relative references must begin with either "/", "./", or "../"

I am currently facing an issue while attempting to load a .obj model into my three.js project. Despite having what I believe to be the correct code (as it compiles without any errors), there is an error showing up in Google Chrome's console. The error ...

The font size of the input DOM element appears smaller than anticipated until the user clicks on the page for the first

I have encountered a strange issue that I haven't been able to find any information about online. In my Angular 2 project, the font size of my bootstrap inputs is set to 1rem. However, after recompiling the project and loading the site for the first t ...

Implementing a stylish gradient background with HTML 5 progress bar tag

I am trying to customize an HTML5 progress bar tag in a unique way: The background of the bar should have a gradient with a fixed width of 100%, but I want the gradient to only be visible where the value of the bar is... progress[value]::-webkit-progres ...

The extent of a nameless function when used as a parameter

I am currently developing a straightforward application. Whenever a user hovers over an item in the list (li), the text color changes to green, and reverts back to black when the mouse moves away. Is it possible to replace lis[i] with this keyword in the ...