Menu
I have an html table in which I am placing images side by side inside the td's. How can I get it so that there is no space at all between each image? By default all browsers seem to put in a small space despite 0 padding and margin on each table element. I am not specifying a width on the td's so by default it takes up the width of the image inside of it.
i.e:
<table>
<tr>
<td><img ... /></td> //no space between the td's
<td><img ... /></td>
</tr>
</table>
597
To remove the unwanted space between images or similar HTML elements do one of the following: Put all the elements on one line with no spaces between them. Put the closing bracket of the previous element immediately before the next element on the next line. Comment out the end of line marker (carriage return).
HTML tables are comprised of rows and cells. In traditional HTML coding you remove the spacing within a cell by setting the “cellspacing” attribute to zero.
Note: A table cell can contain all sorts of HTML elements: text, images, lists, links, other tables, etc.
Display Property: The most commonly used solution is used to change the display property of the <img> tag inside the <div> container from default 'inline' value to 'block' using display : block property.
One more thing that can avoid unwanted space between images:
<td style="line-height:0;">
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
