Html 列表项在列表和 div 区域之外运行
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8730803/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
List items run outside of list and div area
提问by crmepham
I'm having an issue with a menu un-ordered list. Whereby the list items are over running the <ul>and <div>boundaries and only starting the next line once it has reach the edge of the screen.
我遇到了菜单未排序列表的问题。由此列表项超跑<ul>和<div>界限，才刚刚开始下一行一旦到达屏幕的边缘。
Heres the website: http://finalonline.co.uk/mypics/gallery/categories/
回答by Aaron Brewer
Do display: block; always... Never do display: inline;or display: inline-block;
做显示：块；总是...从不做display: inline;或display: inline-block;
To fix the Unordered List from pouring out of the DIV, try going into the CSS and apply this:
要修复从 DIV 中倾泻而出的无序列表，请尝试进入 CSS 并应用以下内容：
ul {
list-style-position: inside;
}
回答by PeeHaa
You can use float: left;on the lis instead of display: inline;.
您可以float: left;在lis上使用，而不是display: inline;.
Just remember to also use overflow: hidden;on the parent element (the ul).
请记住还要overflow: hidden;在父元素 (the ul) 上使用。
Another optionwould be to use: display: inline-block, but I'm not 100% sure about the browser support.
回答by Spencer
Make them display: block, not inline.
制造它们display: block，而不是inline。
回答by BERRY
To fix the Unordered List from pouring out of the DIV, I would suggest going into the CSS and adding a min-width.
为了修复从 DIV 中倾泻而出的无序列表，我建议进入 CSS 并添加一个最小宽度。
so, for example if your parent has a width:600px give the , within that div, a class and set a min-width:600px and this will keep the
因此，例如，如果您的父级宽度为：600px，则在该 div 中提供一个类并设置一个 min-width:600px ，这将保持
