css设置div高度与宽度相等的一种方法


div.category{

    width:33%;

    padding:33% 0 0;

}

1、关键在padding:33% 0 0这句代码,通过设置padding-top与宽度相等(padding使用百分比时,padding-top和padding-bottom使用的也是宽度的百分比,而不是高度的!!!),使div变成正方形。

2、这样设置后,还有问题,div里的内容都被挤到底部了。另外考虑div里文字本身的高度,修改为:

div.category{

    width:33%;

    padding:14% 0 14% 0;

}

结果:

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM