Floating a DIV right causes elements to wrap in IE7

那年仲夏 提交于 2020-02-06 08:07:17

问题


I'm having a problem with floating a container to the right in IE7. Everything looks fine in IE8+, Firefox, Chrome, and Safari but the elements within the container wrap for some reason in IE7.

I've set up a fiddle at http://jsfiddle.net/aagC9/. The problem I'm seeing is visible in the IE7 Browser Mode/Document Mode found in IE9 (it's also in IE7 on XP but I figured this would be easier for people to check out).

While it seems like many people have run into similar problems, their solutions haven't worked for me. I've tried adding overflow: hidden and overflow: visible to both the container and elements in various combinations. I also tried setting a fixed width on the .message container, but that didn't seem to have any effect either. While I could just use a fixed left margin on .message, it doesn't work 100% since the IE7 doesn't support the box-sizing model.

Does anybody know the secret to getting this to work in IE7 with the float?

Thanks!


回答1:


It has to do with your reliance on display:inline-block; which IE7 supports, just not always correctly. Actually, fix for it is pretty gross. But, as in this updated fiddle, it works.



来源:https://stackoverflow.com/questions/11571078/floating-a-div-right-causes-elements-to-wrap-in-ie7

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!