和的margin上下和padding上下不起做用的缘由和解决

今早，工做须要作一个简单的页面，使用到了<span>和<a>标签，发如今样式里面直接写margin-top、margin-bottom和padding-top、padding-bottom都不起做用，页面样式的东西懂得很少，搜索一番，发现是由于<span>和<a>都不是块级元素，因此这几个属性都无效。

解决办法：在样式 中加入display:block;便可解决问题

span{

 display:block;

 width:60px;

 height:20px;

 float:left;

 border:1px solid #B8D0D6;

 text-align:center;

 line-height:20px;

 margin-top:10px;

 margin-left:10px;

}

span:hover{

 background-color:#E8EDF3;

}

span a{

 display:block;

 text-align:center;

 line-height:20px;

}

顺便mark一下，span的样式中，为保证文字水平和垂直居中，须要添加以下的属性：
 text-align:center;
line-height:20px;
其中text-align:center;顾名思义，不须要解释了。line-height:20px;这个属性的值须要和span的高度保持一致。

效果以下：

使用dwz作的一个后台相册管理。