Tumblr水平主题锻造

Question

我开始从零开始构建Tumblr主题，并希望将其设置为可水平滚动的主题。

我得到那么远为我的帖子创建列，但从现在开始，我无法弯曲它们以水平放置而不是垂直放置。

请帮助我的想法和修补程序，因为我是一个开始。

网站：http://geniusite.tumblr.com/ 全码：http://pastebin.com/Wdw7vp2v

Answer 1

你的HTML的结构方式，使这一个很艰难的布局来实现。

理想情况下，您需要组与每个帖子相关的所有元素（照片，标题等）。根据您当前的代码，这将是更合适：

{block:Posts} 
<div class="post"> 
{block:Photo} 
    <div class="left"> 
     <img src="{PhotoURL-HighRes}" width="800px" height="495" alt="{PhotoAlt}"/> 
    </div> 
    <div class="right"> 
    {block:Caption} 
     {Caption} 
    {/block:Caption} 
    </div> 
{/block:Photo} 
</div> 
{/block:Posts} 

至于实现的布局，似乎使用display:table/table-row/table-cell是解决方案在那里的最优（它不需要任何固定宽度，JavaScript的等）。你可以阅读更多有关各种解决方案的水平布局：http://css-tricks.com/how-to-create-a-horizontally-scrolling-site/

我快速放在一起一点点的演示，使用表的解决方案：http://jsfiddle.net/mikedidthis/v4xdR/