CODEWITHSUNDEEP
htmlcsshtml-table
Navi
Navi

Reputation: 1686

Arrange icons in the middle of table row

Hi i need a table like in below image

enter image description here

but i dont know how to arrange images like that.So this is the current code

 <!DOCTYPE html>
<html>
<body>

<table id="tab" border="1">
<tr>
  <td><img align ="center" border="0" src="/images/cam.jpg"  width="15px" height="15px"></td>
  <td><img align ="center" border="0" src="/images/gal.jpg"  width="15px" height="15px"></td>
  <td><img align ="center" border="0" src="/images/chat.jpg"  width="15px" height="15px"></td>
</tr>

</table>

</body>
</html>

check here :http://pastebin.com/HLPdDNyg

Upvotes: 0

Views: 1273

Answers (2)

radha
radha

Reputation: 782

try this one,

table
{
    border:1;
    width:500px;
}
td
{
     border:0;
    width:150px;
    height:150px;
    text-align:center;
}
td img
{
    vertical-align:middle;
}

http://jsfiddle.net/9AxmR/2/

Upvotes: 1

Roko C. Buljan
Roko C. Buljan

Reputation: 206078

Live demo

<table id="tab" >
<tr>
  <td><img src=""></td>
  <td><img src=""></td>
  <td><img src=""></td>
</tr>
</table>

CSS:

#tab{
  border-collapse:collapse;
}
#tab td{
  background:#eee;
  width:100px;
  text-align:center;
  padding:0 15px;
}
#tab td img{
  vertical-align:middle;
}

Upvotes: 1

Related Questions