img {margi...">

How to remove the border between two images?

I tried to set margin and border to 0, but still not working.

<style type="text/css">
img {margin:0;}
</style>
<body>

<img src="/static/btnNext.gif" border="0" />
<img src="/static/btnSave.gif" border="0" />

How to make two images close together?

+5
source share
7 answers

You can remove the css for the image and put the image tags on the same line without spaces.

<img src="/static/btnNext.gif" border="0" /><img src="/static/btnSave.gif" border="0" />
+15
source

Comment out the line break between them.

   <img src="/static/btnNext.gif" border="0" /><!--
--><img src="/static/btnSave.gif" border="0" />

Why? HTML allows so many spaces (both breaking and not) to format the code, but it only displays the first. In your case, images located on different lines are interpreted as the space between them. The simplest solution is to put them on one line, but this is not so readable.

+6
source
<style type="text/css">
img {margin:0; float: left;}
</style>
+2

, , , ; -, diplay: , , , : .

, "enter" . :

<img src="flower1.jpg"/>
<img src="flower1.jpg"/>
<img src="flower1.jpg"/>

OK

<img src="flower1.jpg"/><img src="flower1.jpg"/><img src="flower1.jpg"/>

, .

+1

css - , ...

<style type="text/css">
img {margin:0px; padding: 0px; float: left;border:0px}
</style>
0

div, float: left. 2 div div, float: left like,

<div style="float:left">
<div style="float:left">
<img src="/static/btnNext.gif" border="0" />
</div>
<div style="float:left">
<img src="/static/btnSave.gif" border="0" />
</div>
</div>
0
source

Remove spaces between tags imgand use cssvertical-align:top

HTML:

<img src='http://i.imgur.com/wipljF1.png'/>NoSpaces<img src='http://i.imgur.com/wipljF1.png' class='playerpreviewbig'/>NoSpaces<img src='http://i.imgur.com/wipljF1.png' class='playerpreviewbig'/>

CSS

img {
width: 50px;
height: 50px;
padding: 0;
margin: 0;
vertical-align:top;
}
0
source