Divs 拒绝对齐

Question

我对 CSS / HTML 还很陌生，但通常可以弄清楚一些事情。虽然不是这个问题......我花了 2 天时间试图修复它，但没有任何乐趣

使用带有自定义 css 的 WP 3.9.1 和 WooThemes Mystile 进行更改；不需要子主题。当我使用左对齐在页面上放置带有标题的图像时，有些人会和其他人强烈拒绝。在较旧的 WP 中，它总是对齐所有留下的图像来创建行，但似乎不是 3.9.1。我已经尝试了所有我能想到的方法，但是那些应该左对齐的图像实际上是居中的。

使用 Firebug 或 Safari Inspector，我尝试将它们左对齐，即使使用负边距左对齐也不会将图像放置在它所属的位置。几乎就像有某种分页符，因为没有更好的术语，那就是让它设置在中心的右边。就像它认为那个位置是左边的一样。

我没有使用任何图库或插件，只是将图像添加到页面中并在文本框中带有标题，而不是视觉。我在 Store 下的大部分画廊都是一团糟。 :(

以下是其中的一个示例：Tuscany Gallery 大多数画廊我想要连续 2 个横向或 3 个垂直。有时，如果图像数量为奇数，我可能会将 1 到 3 张图像居中，但大多数都是左对齐。

任何帮助将不胜感激！谢谢！

Re: Body CSS 代码

我有一些颜色变化和更多 div#attachmet_number（不认为你需要所有这些），但仅此而已。

:active, :focus { 
outline-style: none !important; 
-moz-outline-style:none !important; 
}

a {
outline-style: none;
-moz-outline-style: none;
}

a:before {
outline: none !important;
}


a:imag { 
outline: 0px none; 
}

#sidebar .post-46 {
display: none !important;
}

article.post-46 img.alignleft {
margin: 0 1.618em 1em 16px;
} 

.post .alignleft, .type-page .alignleft {
margin-bottom: 50px;
}


.post-282 .wp-caption img, .type-page .wp-caption img {
margin: 0 0 0 0.4em;
}


div#attachment_283 {
margin-left: 42px;
}

div#attachment_286 {
margin-left: 42px;
}

div#attachment_291 {
margin-left: 42px;
}

我不太确定这是否是您需要的。 div#attachment_number 是框内的图像，其下方带有标题（标题）。

带有标题的图像的 HTML

[caption id="attachment_516" align="alignleft" width="407"] 比萨大教堂[/caption]

Answer 1

根据您的问题，您的第四张照片（Autumn Drive）被您的第二张照片（Duomo di Pisa）的底部边缘推到了右侧>）。

您似乎为 HTML 中的每个 div 添加了特定宽度。如果您还要为每个 div 添加一个特定的、相等的高度，那么它们将对齐并允许下面的 div 向左浮动。

更理想的做法是在 CSS 中为横向 div 声明一个类，在其中定义统一的宽度和高度，并将该类分配给所有横向 div。这样，您可以轻松地在一个位置更改宽度和高度，并且它将应用于分配了该类的所有 div（并且可以将多个类分配给单个 div；只需用空格分隔它们，例如 class="landscape framed dark" )。