我似乎遇到了这个布局问题：
我有一个专门定位的<div id="content">，里面有<ul id="grid">。网格的每个<li>都有一个<a>，其中包含<img>（缩略图），链接到较大的图像。这形成了一个体面的图像网格，大小灵活，因为<li>元素包裹在较小的窗口大小中。很基本，很好地退化等...
问题是，现在我想将网格置于<div>内。我将<ul>设置为float: left;，使其收缩到所包含项目的大小，而不是默认的100％宽度。然后我在其上使用position: relative; right: 50%;，然后在position: relative; left 50%;上使用<li>。这个应该具有移动以div为中心的列表的效果（你可以更好地了解我要从reading this article获得什么），但问题是{{ 1}}试图尽可能宽地伸展以容纳溢出列表，因此比其包含元素的区域更宽。最终结果是，计算结果被抛弃，我的网格不居中。
如果需要澄清，我会尽力而为，但问题是：是否可以强制包含元素（在本例中为<ul>）缩小到其子元素的大小包裹发生的情况？我试图完全避免使用javascript。
答案 0 :(得分：0)
捂脸
<ul style="text-align: center; width: 100%;">和<li style="display:inline;">修正了这一点。应该知道它在发布后立刻就打了我！