Question

我买了一个名为“摄影师”的wordpress主题，我尝试将图像显示在画廊中心。

我在他们的支持论坛上问过，他们给了我这段代码

.gallery-item {  text-align: center; width: 100%; }

但是，将肖像图像拉伸到风景图像的宽度，从而使它们真的很长。我尝试了每一个我找到的解决方案，似乎不可能做到这一点。我提到即使在Wordpress页面编辑器中，我也将图像对齐在中心。

此处的示例页面：http://vladilas.ro/test/portfolio/mihaela-si-paul-gura-humorului-rarau-2015/

如果有人知道如何解决这个问题，我们将非常感激。

谢谢！

Answer 1

试试这个：

.gallery-item {margin：0 auto;}

Answer 2

添加以下css。

figure {
 display: inline-block;
 text-align: initial;
 vertical-align: top;
 position: relative;
 margin: 0.5em;
 font-size: 0.8em;
 background: white;
 overflow: hidden; 
}

figure.img {    
 display: block;
 margin-left: auto;
 margin-right: auto;
}

然后删除.gallery-item {float: left; }

应该这样做。

Answer 3

这应该可以阻止拉伸＆amp;职位中心：

.gallery-item {margin: 0 auto; position:relative; float:none; max-width:100%;}

Answer 4

由于您的图库项目位于绝对位置，因此您可以将此规则添加到自定义CSS中，以便将它们置于中心位置：

.gallery-item {
  left: 50%;
  transform: translateX(-50%);
}

Answer 5

不幸的是，没有一种解决方案有效。这真的很疯狂。

我在此处发布问题之前做的一件事是手动将margin-left指定为仅为肖像照片设置的固定值（以像素为单位）。但它不是理想的解决方案，因为我的一些旧照片的分辨率稍低，所以它们会出现在离开中心的地方。

我认为，我设法用运气解决了这个问题。 CSS代码是：

.gallery-icon.portrait
{
    margin-left: 20%;
    margin-right: 20%;
}

我知道这可能不是最好的解决方案，但现在它似乎工作:) 非常感谢您的帮助，也许可以告诉我您对我的CSS的看法:)）

我需要将图像置于图库中，没有任何作用

5 个答案: