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

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; width: auto; position: relative; }

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}