1

我在我的 Wordpress 网站上使用 NextGen 画廊，但画廊框不尊重页面其余部分的左边距（也就是说，所有其他图像、文本等都有某种缩进或填充，但是NextGen Gallery 一直漂浮到左侧）。我想防止它覆盖这个填充，或者至少浮动到中心。我已经尝试在几个地方编辑 css，但我可能正在编辑错误的类，或者其他什么。画廊的一个例子在页面底部附近http://www.montereyhighdrama.com/multimedia/the-marriage-of-figaro-2010/谢谢。

4

4 回答 4

3

不知道如何让它尊重左填充，但这确实可以使整个缩略图集浮动到中心。

.ngg-galleryoverview {
text-align:center;
}

.ngg-gallery-thumbnail-box {
float:none !important;
display:inline-block;
}
于 2013-11-01T18:56:18.207 回答
2

将这些行添加到您的中style.css，您应该已准备就绪：

.ngg-galleryoverview { text-align: center; }
.ngg-gallery-list { display: inline-block; margin: 0; }
.ngg-gallery-list li { float: none; display: inline-block; }
于 2013-08-01T17:17:33.223 回答
0

我有同样的问题，但需要一个动态地适用于所有下一代画廊的解决方案，所以我使用了媒体查询。顺便说一句，我找不到任何其他解决方案，也不知道如何使用上面的代码。

我正在使用 Catalyst/Dynamik 主题，因此我可以设置精确的页面宽度和 #container-wrap 初始填充，但这对缩略图居中或改善移动设备外观没有任何作用。

这些是我的媒体查询，您必须根据缩略图大小进行调整，我使用了 220 像素宽。

最终结果：http : //site01.profoliolive.com/fixed-grid/ 在 iPad、iPhone 和 Android 手机上测试。

@media (max-width: 1209px) {
  .ngg-galleryoverview { padding-left: 115px; }
}

@media (max-width: 1170px) {
  .ngg-galleryoverview { padding-left: 90px; }
}

@media (max-width: 1140px) {
  .ngg-galleryoverview { padding-left: 80px; }
}

@media (max-width: 1120px) {
  .ngg-galleryoverview { padding-left: 70px; }
}

@media (max-width: 1090px) {
  .ngg-galleryoverview { padding-left: 60px; }
}

@media (max-width: 1070px) {
  .ngg-galleryoverview { padding-left: 50px; }
}

@media (max-width: 1050px) {
  .ngg-galleryoverview { padding-left: 40px; }
}

@media (max-width: 1030px) {
  .ngg-galleryoverview { padding-left: 25px; }
}

@media (max-width: 1010px) {
  .ngg-galleryoverview { padding-left: 20px; }
}

@media (max-width: 990px) {
  .ngg-galleryoverview { padding-left: 10px; }
}

@media (max-width: 975px) {
  .ngg-galleryoverview { padding-left: 120px; }
}

@media (max-width: 900px) {
  .ngg-galleryoverview { padding-left: 80px; }
}

@media (max-width: 860px) {
  .ngg-galleryoverview { padding-left: 60px; }
}

@media (max-width: 830px) {
  .ngg-galleryoverview { padding-left: 40px; }
}

@media (max-width: 800px) {
  .ngg-galleryoverview { padding-left: 15px; }
}

@media (max-width: 760px) {
  .ngg-galleryoverview { padding-left: 0px; }
}

@media (max-width: 741px) {
  .ngg-galleryoverview { padding-left: 110px; }
}

@media (max-width: 660px) {
  .ngg-galleryoverview { padding-left: 80px; }
}

@media (max-width: 620px) {
  .ngg-galleryoverview { padding-left: 25px; }
}

@media (max-width: 507px) {
  .ngg-galleryoverview { padding-left: 20px; }
}
于 2013-06-25T16:03:44.897 回答
-2

简单的方法是使用：

<center>[nggallery id=1]</center>或者<div align="center";>[nggallery id=1]</div>

于 2013-03-29T18:52:45.640 回答