firefox table caption BUG
最近在做一个表格的时候发现table元素的标题caption里面的元素在使用绝对定位的时候会跑出去,开始还以为是块级元素没有定义width的问题,后来才发现这个好像是firefox里面的一个BUG,也可能是firefox对此标签支持的问题吧。
<table> <caption> <span id="Pre"><<</span> <div><span id="Year"></span>年<span id="Month"></span>月</div> <span id="Next">>></span> </caption> <thead> <tr> <th>日</th> <th>一</th> <th>二</th> <th>三</th> <th>四</th> <th>五</th> <th>六</th> </tr> </thead> </table>
#Pre{position:absolite; left:0;cursor:pointer} #Next{position:absolite; right:0;;cursor:pointer} caption{position:relative;}
在firefox里这两个Span标记跑到外边去啦。
最后只好用float这两个span元素了。
但是float导致span换行,之后用负数的margin搞定。
#Pre{float:left; cursor:pointer} #Next{float:right;cursor:pointer;margin-top:-14px}
养成习惯性的写符合语义的标签是很重要的,但愿这个caption元素不是W3C的过期元素。