Question

这可能听起来很奇怪，但我有一些css对齐mys div。在一个地方，我也使用http://www.brunildo.org/test/img_center.html来集中图像。

现在我希望我的div在一个更大的div里面去另一条线，如果这个已经满了。浮动：左边似乎是答案。问题是它破坏了我的格式。在上面的链接中包含解决方案。我有这个测试代码。如果我移除宽度并浮动它看起来很好，除了它可能占用太多空间而不是去另一条线。

我以为我可以在外部使用浮动并将图像置于其中。但浮动：左边仍在打破它。我希望有一种方法可以删除浮动，所以每个div都会向左移动，但div内部正确地不会破坏我的格式。

<style type="text/css">
.wraptocenter {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    width: 200px;
    height: 200px;
    background: blue;
}
.wraptocenter * {
    vertical-align: middle;
}
/*\*//*/
.wraptocenter {
    display: block;
}
.wraptocenter span {
    display: inline-block;
    height: 100%;
    width: 1px;
}
/**/
div.c
{
background: red;
overflow: hidden;
min-width: 400px;
max-width: 400px;
}
div.c div
{
float: left;
}
</style>
<!--[if lt IE 8]><style>
.wraptocenter span {
    display: inline-block;
    height: 100%;
}
</style><![endif]-->

<div class="c">
<div>

<div>
<div class="wraptocenter"><span></span><img src="a.jpg" alt="/a.jpg"></div>
<div class="wraptocenter"><span></span><img src="a.jpg" alt="/a.jpg"></div>
<div class="wraptocenter"><span></span><img src="a.jpg" alt="/a.jpg"></div>

</div></div></div>

Answer 1

常规旧display:inline可用于图像本身（或容器div）。这将使项目流入多行，具体取决于封闭div的宽度。

以顶级div为中心，margin: 0 auto之类的内容（如果父级有宽度）或者旧的<center>标签（如果没有）。

从外部div中删除/忽略浮点数

1 个答案: