English 中文(简体)
简单的例子打破了“利”的比值,我不知道为什么
原标题:Simple css example that breaks margin-bottom for <li> and I don t know why
  • 时间:2011-04-10 21:39:30
  •  标签:
  • html
  • css

Code: http://jsfiddle.net/74y7h/

When I float:left the item-content div, suddenly margin-bottom no longer works on each of the items in the list. Remove the float:right line and re-run the code and you ll see the margins reappear between the list items.

为什么发生这种情况? 我不需要一个完整的教训,但希望能简单地解释一句话或两句,而不仅仅是固定句子。 感谢!

最佳回答
问题回答

Apply overflow:hidden to the containing element (.item). Give it a shot. It works. Applying the overflow (hidden or auto) triggers a new "block formatting context" for the containing div that doesn t run all over the floated elements. I can t say I understand completely why it works, but it does (and it s different from hasLayout issues).





相关问题
CSS working only in Firefox

I am trying to create a search text-field like on the Apple website. The HTML looks like this: <div class="frm-search"> <div> <input class="btn" type="image" src="http://www....

image changed but appears the same in browser

I m writing a php script to crop an image. The script overwrites the old image with the new one, but when I reload the page (which is supposed to pickup the new image) I still see the old one. ...

Firefox background image horizontal centering oddity

I am building some basic HTML code for a CMS. One of the page-related options in the CMS is "background image" and "stretch page width / height to background image width / height." so that with large ...

Separator line in ASP.NET

I d like to add a simple separator line in an aspx web form. Does anyone know how? It sounds easy enough, but still I can t manage to find how to do it.. 10x!

热门标签