Mediawiki css自定义:设置最大宽度

时间:2015-12-19 10:10:56

标签: css mediawiki

我已经设置了一个mediawiki网页。 我发现文本扩展到浏览器宽度的100%是令人讨厌的。

我尝试使用MediaWiki:Common.css来设置最大宽度,但到目前为止我得到的结果很差:特别是它不会优雅地降级。 有人尝试过并成功了? 我无法通过互联网搜索找到有效的解决方案。

这是我最好的结果:(把它放在MediaWiki:Common.css中)

div#content { max-width: 800px; }

降级正常,但右侧导航栏偏离右侧。

版本:MediaWiki 1.22.2

2 个答案:

答案 0 :(得分:1)

对于矢量皮肤,将下一行放入MediaWiki:Vector.cssUser:Name/vector.css。:

/* set max width and fix the background */
html,
body {
    position: relative;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 1280px;
    background-position: top left;
    background-repeat: repeat-x;
    background-size: 100% 5em;
    background-image: url(/skins/Vector/images/page-fade.png);
    background-color: #f6f6f6;
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(50%,#ffffff),color-stop(100%,#f6f6f6));
    background-image: -webkit-linear-gradient(top,#ffffff 50%,#f6f6f6 100%);
    background-image: -moz-linear-gradient(top,#ffffff 50%,#f6f6f6 100%);
    background-image: linear-gradient(#ffffff 50%,#f6f6f6 100%);
}

/* set blue right border */
.mw-body { border-right: 1px solid #A7D7F9; }

/** fix the position of:
            personal user menu
            search bar
            the pop-up indicator of language selector
            search suggestions 
**/
#p-personal { right: 3pt; }
#p-search { margin-right: 3pt; }
.imeselector { position: fixed; }
.suggestions { right: 3pt !important; }

如果您要将此CSS应用于受限制的网页,请在LocalSettings.php下写下一行,但首先请检查 this comment

$wgAllowSiteCSSOnRestrictedPages = true;

更多细节可以在这个MW谈话页面找到:

答案 1 :(得分:0)

  #globalWrapper {
    max-width: 800px !important;
    margin: auto !important;
    position: relative;
  }