2

我最近购买了一个 wordpress 主题，但遇到了一个似乎无法解决的 CSS 问题。不幸的是，主题制作者不再提供支持，所以我希望你们中的一个可以在这里帮助我：D

如果您查看此网站：

demo.shakenandstirredweb.com/shaken-grid/

在 Google Chrome 中，您会看到标题向左浮动。好的！

但是，如果您在 Firefox 中查看该站点，您会发现标题不会向左浮动，而是停留在中间位置。我一直在搞乱 id 和 classes 标头、包装和站点信息，但我似乎无法让 Firefox 标头像 Chrome 一样向左浮动。

铬合金

http://d.pr/i/YbPH

标题根据正文中的内容向左浮动。

火狐

http://d.pr/i/hrTI

标题仍然在中间。

有什么建议么？

感谢您抽时间阅读！

编辑：好的，我发现这是divclass wrap。在 Firefox 中，最大宽度“卡在”上1300px，而 Chrome 会自动扩展宽度。奇怪的是，.wrap样式表中的宽度设置为1010px，边距自动。有人知道我应该怎么做吗？

编辑：好的，我认为这与javascript有关。我猜这个功能不适用于 Firefox：

function centerLayout(){
    if( jQuery(window).width() > mobile_width ){
        jQuery('#header .wrap, #footer .wrap, #filtering-nav, .navigation').css('width', jQuery('.isotope').width() - 10);
    }
}

有小费吗？

4

3 回答 3

0

这应该解决它：

将此添加到您的样式表中：

#grid {
  margin: auto;
  width: 1050px;
}
于 2012-11-29T20:53:13.820 回答
0

试着做

例如，在此我放置 3 列，但要确保它适用于所有浏览器

-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari and Chrome */
column-count:3; /*normal att*/

用 -moz- 做一次，用 -webkit- 做一次，没有

某些属性并非所有浏览器都能理解，因此您需要添加浏览器使用的套件名称，例如示例中的多列并不总是受支持，因此我需要添加套件名称

我想使用的属性是“column-count”，我照常编写并确保它在所有其他浏览器中都能完美运行，我在属性名称之前添加了“-kit name-”

希望我这次解释清楚=]

于 2012-11-29T20:54:11.870 回答
0

尝试做类似的事情

CSS

#header {
  overflow: hidden;
}

#header > .wrap {
  float: left;
  width: 100%;
}

JS

function centerLayout(){
  if(jQuery(window).width() > mobile_width ){
    newWidth = jQuery('.isotope').width() - 10;
    jQuery('#header .wrap, #footer .wrap, #filtering-nav, .navigation').css('width',newWidth);
  }
}
jQuery(document).ready(centerLayout);
于 2012-11-30T18:26:27.127 回答