Use CSS to remove the space between images

Question

Given    lt img src        gt   lt img src        gt    The result is two images with a single space between them  It seems that the normal behavior is to show any number of spaces  newlines  and tabs as a single white space  I know I can do the following    lt img src        gt  lt img src        gt    OR   lt img src        gt  lt  -- -- gt  lt img src        gt    OR   lt img src         gt  lt img src        gt    Or any number of other hacks  Is there a way to remove that whitespace with CSS  e g    lt div class  nospace  gt       lt img src        gt       lt img src        gt   lt  div gt

User · Answer

The best solution I ve found for this is to contain them in a parent div  and give that div a font-size of 0

User · Answer

I found that the only option that worked for me was  font-size 0    I was also using overflow and white-space  nowrap   float  left  seems to mess things up

User · Answer

I prefer do like this   img   float  left      to remove the space between images

User · Answer

An easy way that is compatible pretty much everywhere is to set font-size  0 on the container  provided you don t have any descendent text nodes you need to style  though it is trivial to override this where needed     nospace      font-size  0      jsFiddle   You could also change from the default display  inline into block or inline-block  Be sure to use the workarounds required for  lt   IE7  and possibly ancient Firefoxes  for inline-block to work

User · Answer

Make them display  block in your CSS

[html] Use CSS to remove the space between images

Examples related to html

Examples related to css