Tumblr永久链接页面发布重叠的笔记

Question

我是建立主题的新手，只是把它放在一起我自己。我的主题使用了Masonry，我的帖子浮现在索引页面上，但我试图设置永久链接页面的样式，我无法弄清楚如何在帖子下方获得帖子笔记。示例here。我看到几个星期前问过这个问题（here），解决方法是将top: 100%;添加到css中的永久链接样式，但我试过了，但没有运气。

这里是帖子的CSS（注释掉部分是我尝试修复它）

#container {
    position: absolute;
    left: 259px;
    width: 830px;

}

.posts {
    width: 350px;
    float: left;
    margin: 15px;
    background-color: #ffffff;
    padding: 10px;
    border: 5px solid #4e4e4e;
    /*
    {block:PermalinkPage}
    padding-right: auto;
    padding-left: auto;
    float: none;
    {/block:PermalinkPage}
    */
}

...

.permalinknotes {
top: 100%;
}

#container #notecontainer {
  margin: auto;
  width: 500px;
  font-size: 12px;
  margin-top: auto;

}

#container #notecontainer ol.notes {
  list-style-type: none;
  /* margin: 50; */
  padding-top: 50;
}

#container #notecontainer img.avatar {
  margin-right: 10px;
  width: 16px;
  height: 16px;
}

HTML：

<div id="container">
    {block:Posts}
        <div class="posts">

            {block:Text}
                <div class="title">
                    {block:Title}
                        {Title}
                    {/block:Title}
                </div>
                {Body}
            {/block:Text}

            {block:Photo}

                {LinkOpenTag}
                    <img src="{PhotoURL-400}" alt="{PhotoAlt}"/>
                {LinkCloseTag}
                {block:Caption}
                    {Caption}
                {/block:Caption}


            {/block:Photo}

            {block:Panorama}
                {LinkOpenTag}
                    <img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>
                {LinkCloseTag}
                {block:Caption}
                    {Caption}
                {/block:Caption}
            {/block:Panorama}

            {block:Photoset}
                {Photoset}
                {block:Caption}
                    {Caption}
                {/block:Caption}
            {/block:Photoset}

            {block:Quote}
                <div class="quote">
                    "{Quote}"
                </div>
                <!--
                {block:Source} -->
                    <div class="quotesource">
                        {Source}
                    </div>
                <!--{/block:Source}
                -->
            {/block:Quote}

            {block:Link}
                <a href="{URL}" class="link" target="_blank" {Target}>
                    {Name}
                    {block:Thumbnail} <img src="{Thumbnail}"/> {/block:Thumbnail}
                </a>
                {block:Description}
                    {Description}
                {/block:Description}
            {/block:Link}

        <div class= "chat">
            {block:Chat}
                {block:Title}
                    {Title}
                {/block:Title}
                {block:Lines}
                    <li>
                        {block:Label}
                            {Label}
                        {/block:Label}
                        {Line}
                    </li>
                {/block:Lines}
            {/block:Chat}
        </div>

            {block:Video}
                {Video-400}
                {block:Caption}
                    {Caption}
                {/block:Caption}
            {/block:Video}

            {block:Audio}
                <div align="center">{AudioEmbed-250}</div>
                {block:Caption}
                    {Caption}
                {/block:Caption}
            {/block:Audio}

            {block:Answer}
                <div class="asker">
                    {Asker} asked:
                </div>
                <div class="question">
                    {Question}
                </div>
                {Answer}
            {/block:Answer}

            <div class="permalinks" style="height: 15px; width: 341px; opacity: 0.5;">
                <div class="date">
                    <a href="{Permalink}">{TimeAgo} </a> &hearts; <a href="{Permalink}">{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}</a>
                </div> 

                <div class="reblogs">
                    {block:RebloggedFrom}
                        {<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>} {<a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>}
                    {/block:RebloggedFrom} &nbsp;
                    <div id="buttons">{LikeButton color="black" size="13"}</div>&nbsp;<div id="buttons">{ReblogButton color="black" size="13"}</div>
                </div>
            </div>

            <div class="tags">{block:HasTags}{block:Tags}<a href="{TagUrl}"> #{Tag}&nbsp;</a>{/block:Tags}{/block:HasTags}</div>
            </div>


            {block:PostNotes}
            <div class="permalinknotes">
                <div id="notecontainer">{PostNotes}</div>
            </div>
            {/block:PostNotes}



    {/block:Posts}

</div>