3 Comments on “What is the CSS for removing a gap between two images placed side by side on a webpage?”

1. jaxicle
   April 22nd, 2008 at 7:33 pm

   padding: 0;
   margin: 0;

   depends on the div, so for example:

   #picture1,
   #picture2 {
   height: 500px;
   width: 500px;
   margin: 0;
   padding: 0;
   }

   You can also start your stylesheet off with:

   * {
   margin: 0;
   padding: 0;
   }

   that will remove all margins and paddings site-wide so you don’t have to keep repeating the margin/padding: 0; stuff.

2. mzanime2000
   April 25th, 2008 at 12:57 pm

   I believe this is normal behavior, especially in quriks mode. I usually just close gaps between images, so make sure there is no white space between the tags. Make sure you close the space in the middle of those tags in the HTML code.

3. Jason King
   April 27th, 2008 at 11:54 pm

   Removing padding and margins for all html elements is a good idea e.g.

   * {
   padding: none;
   margin: none;
   }

   but if you simply want to remove padding and margins from all images, put ‘img’ instead of the asterisk.

   While you’re at it, add ‘border: none;’ to remove the blue border that appears when a hyperlink is put on an image.

Leave a Reply

You must be logged in to post a comment.