使用display:table来解决一些问题
2016-08-23 11:51
134 查看
一直有,多栏的需求,当然用table布局,很快就做完了。不怎么喜欢用table,刚开始使用display:table,但是有一条老是不能达到我的效果,那就是有一行不固定宽度的时候,就不知道怎么处理,今天终于发现了怎么解决这个问题的办法,将width:尽可能大。使用table-layout:auto;代码如下:
记录此文章,以备后查。
<div style="display:table;" id="addresses"> <div style="display:table-row;"> <div style="display:table-cell;padding-right: 15px;vertical-align: middle;padding-left:25px;border-bottom:1px solid #999;"> <img style="width: 19px;" src="../images/mypoint.png" /> </div> <div style="display:table-cell;width:99999px;font-size:14px;padding-right:5px;border-bottom:1px solid #999;"> <div>无法确认地址,请电话联系客服我很长!</div> <div style="color: #999;">xxxxx</div> </div> <div style="display:table-cell;padding-right:10px; vertical-align: middle;width:100px;font-size:14px;white-space:nowrap;border-bottom:1px solid #999;"><span style="color: #999; line-height: 40px">¥10.00起送</span></div> </div> <div style="display:table-row;"> <div style="display:table-cell;padding-right: 15px;vertical-align: middle;padding-left:25px;border-bottom:1px solid #999;"> <img style="width: 19px;" src="../images/mypoint.png" /> </div> <div style="display:table-cell;width:99999px;font-size:14px;padding-right:5px;border-bottom:1px solid #999;"> <div>话联系客服!</div> <div style="color: #999;">xxxxx</div> </div> <div style="display:table-cell;padding-right:10px; vertical-align: middle;width:100px;font-size:14px;white-space:nowrap;border-bottom:1px solid #999;"><span style="color: #999; line-height: 40px">¥125.00起送</span></div> </div> </div>
记录此文章,以备后查。
相关文章推荐
- 对table的tr使用display:block显示colspan失效问题的解决
- 使用TableDiff实用工具解决事务复制中的问题
- VC2005使用的一些问题及解决方法
- 使用TableDiff实用工具解决事务复制中的问题
- 在wpf开发中,使用prism的一些问题解决
- 使用vs2008时出现一些问题的解决
- tomcat,jboss使用中遇到的一些问题的解决
- [转贴]使用TableDiff实用工具解决事务复制中的问题
- 使用TableDiff实用工具解决事务复制中的问题
- 使用OmniORB出现的一些问题及已实现的解决方法
- Nokia N72的一些使用问题的解决(不断更新中...)
- VC2005使用的一些问题及解决方法
- vs2008与IIS 7.0使用在vista上时出现的问题及解决方法(Internet Explorer 无法显示该页面)(VS2008: IE Cannot Display Web Page)
- 关于dao得一些使用问题,以备忘....也用来纪念自己解决得第一个内存泄漏问题
- 使用javamail发信过程中的一些问题及解决方法
- 使用TableDiff实用工具解决事务复制中的问题
- 转:邹建--使用TableDiff实用工具解决事务复制中的问题
- 使用bcp批量导入数据时碰到的一些问题及解决
- C++Builder中关于INDY库的使用 以及一些问题的解决(E2238 Multiple declaration for 'fd_set')
- 使用TableDiff实用工具解决事务复制中的问题