使转换后的joomla模板在主要内容中显示2列

Question

我已按照以下步骤将html / css模板转换为joomla模板：http://www.tobacamp.com/tutorial/5-easy-steps-converting-html-template-to-joomla-template/。

然而，它没有说明如何使主要内容显示两列或三列而不是一列（如报纸等）。

我希望我的Joomla主页的主要内容能够显示2或3列中的文章。仅限主要内容。

我已尝试过所有内容但无效。

我必须输入什么php或css代码才能让我的文章在主要内容的2-3列中显示，而不是在另一列中显示

Answer 1

虽然并非所有浏览器都支持，但您可以（应该）使用CSS Multi Columns来实现此目的。它适用于IE10 +，Opera 11.1+（标准语法）和Firefox 2 +，Chrome 4 +，Safari 3.1+（供应商前缀）。对于其他浏览器，您可以使用JS library。

使用示例

HTML（index.php）

...
<jdoc:include type="message" />
<div id="content">
    <jdoc:include type="component" />        
</div>
...

CSS

#content {
    -webkit-column-count: 3;
    -webkit-column-width: 75px;
    -webkit-column-gap: 20px;
    -webkit-column-rule: 1px solid #fff;
    -moz-column-count: 3;
    -moz-column-width: 75px;
    -moz-column-gap: 20px;
    -moz-column-rule: 1px solid #fff;
    -o-column-count: 3;
    -o-column-width: 75px;
    -o-column-gap: 20px;
    -o-column-rule: 1px solid #fff;
    column-count: 3;
    column-width: 75px;
    column-gap: 20px;
    column-rule: 1px solid #fff;
}