Question

https://jmri.org.in/jmri/issue/archive是该网站。如您所见，问题排列在垂直列表中。我想通过html / css在水平列表中显示它们。

此处模板中的代码是

<div class="issues_archive">
        {iterate from=issues item=issue}

            <ul>{if $issue->getYear() != $lastYear}
                <h2>{$issue->getYear()|escape} Issues</h2>
                {assign var=lastYear value=$issue->getYear()}<hr>
                {/if}
                                   {include file="frontend/objects/issue_summary.tpl"}
                        </ul>
                        <br><br>    
        {/iterate}

        {if $issues->getPageCount() > 0}
            <div class="cmp_pagination">
                {page_info iterator=$issues}
                {page_links anchor="issues" name="issues" iterator=$issues}
            </div>
        {/if}
    {/if}
</div>

.CSS代码

ul.csv2 { display：-webkit-inline-box; text-align：center;宽度：自动;位置：相对; }

Answer 1

编辑：

我注意到你有结构性问题：

1. remove all the br tags
2. the h2 tag in issueabc, needs to be outside of csv class

之后添加

display: inline-block;

到ul.csv

由于我多年没有使用过PHP，我的语法不正确，但这里是：

{iterate from=issues item=issue}
    {if $issue->getYear() != $lastYear}
        <h2>{$issue->getYear()|escape} Issues</h2>
        {assign var=lastYear value=$issue->getYear()}<hr>
    {/if}
    <ul>
       {include file="frontend/objects/issue_summary.tpl"}
    </ul>
{/iterate}

如何以水平对齐方式显示垂直列表

1 个答案: