CSS Fix for Inline Images Showing Gaps in XHTML Strict Doc

Hello,
I have a little problem with displaying images side by side.
A simple example:



The first two images are displayed side by side, BUT with a small space between them (the newline character is converted to a space).
The second two pictures are displayed next to each other without any break - the effect I want.

Unfortunately, I have a generated page, so I can't put all tags on one line.

How can I make the first two images also display without any interruption?

Setting CSS attributes (width, height - I set)

did not work :(

DOCTYPE I have XHTML Strict but Transitional displays the same.

Thanks for the help,
Zbyszek

Try adding border=0 attribute (not CSS).

zbika73 wrote:

Unfortunately, I have a generated page, so I can't put all tags on one line.

In HTML, spaces (between tags), lines or tabs don't matter. You might as well write everything on one line, or with line spacing every letter - the effect in the browser should be the same. Are you sure that the inserted image doesn't accidentally have a few empty vertical lines on one of the sides, which gives the impression of being spread out?

how it will be displayed depends on the size of the images

Unfortunately, it is rather impossible to get around the problem of not separating images that are separated by enter or tab in the codes. You can try to set the right margin to negative (margin-right: -2px}, but this may produce unexpected results and will not take into account the size of the "active" font.

Zbika73: Don't you sometimes mean something similar to the one below?



You can also fight with "div style="float:left..." instead of table.

Or try giving:

style="font-size:0pt;"

Thank you for your comments.

I had to put the code with the images on a single line. This required changing the generator, but project colleagues accommodated my need.
Everything looks as it should.

Attempts to work around (div, style change, inserting a table) did not bring the expected results, so it was easier to focus on changing the generating code.

A very important thread. Browsers like IE and FF have come a long way in development and still don't fully implement their "tagging". On the other hand, using code without whitespace between elements reduces the share of spaces in network traffic. Just let's try to edit a 30K file in one line, eg in such a cool editor as "vim". The processor sweats like gluing divx.
A good lesson for everyone who doesn't know all the secrets of html. Well, congratulations on the solution. Found by the way link