CODEWITHSUNDEEP
css
StudioTime
StudioTime

Reputation: 23989

CSS display:table-cell loses margin property

I have a css class which works perfectly:

.img_holder { width:126px; height:126px; border:1px solid #ccc; overflow:hidden; margin:12px; }

However, when I try to center the image in the div by adding display:table-cell and vertical-align properties, the margin stops working and the div goes top left of its parent... Is this a known effect?

new class which margin fails:

.img_holder { width:126px; height:126px; border:1px solid #ccc; overflow:hidden; margin:12px; display:table-cell; vertical-align:middle; }

Upvotes: 3

Views: 2592

Answers (2)

Kosal
Kosal

Reputation: 41

To get spacing between the cells you might want to use border-spacing:20px;

Upvotes: 3

Marat Tanalin
Marat Tanalin

Reputation: 14123

Table cells cannot have margins.

Upvotes: 2

Related Questions