html - inline-block img elemets have a gap when start a new line? -
when display img inline-block.but there gap between first line , second !! below sample, picture1 , picture3 have gap?i dont't want gap..so me..
img { display:inline-block; width:200px; background-color:#ccc; border:5px solid red; padding:10px; text-align:center; margin:0px; }
<img alt="picture1"/><img alt="picture2"/><img alt="picture3"/><img alt="picture4"/>
images make gap default, can fix using vertical-align
img { display: inline-block; width: 200px; background-color: #ccc; border: 5px solid red; padding: 10px; text-align: center; margin: 0px; vertical-align: middle; }
Comments
Post a Comment