Trying to get Tumblr blocks to work inline

tumblr

I'm trying to get the Tumblr Photo post blocks "Caption", "Tags" and "Date" to appear inline.

I tried a couple of ways but have got stuck, as the "Caption" block refuses to work in line and seems to like being on its own line.

The blog is: http://holidaytim.tumblr.com/. (Ignore the coloured borders, that's just for my reference.)

I've added the following block:

{block:post_Text}

    <ul class="postText">

        {block:Caption}
        <li class="postText"> {Caption} </li>
        {/block:Caption}

        {block:Date}
        <li class="postText"> {DayOfWeek} </li>
        {/block:Date}

        {block:Date}
        <li class="postText"> {DayOfMonth} </li>
        {/block:Date}

        {block:Date}
        <li class="postText"> {Month} </li>
        {/block:Date}

        {block:Date}
        <li class="postText"> {Year} </li>
        {/block:Date}

        {block:Tags}
        <li class="postText"><a href="{TagURL}">{Tag}</a></li>
        {/block:Tags}

    </ul>

{/block:post_Text}

With the following CSS declarations:

ul.postText {
    border: 1px solid red;
}

li {
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
    text-align: left;
}

li.postText {
    display: inline;
    border: 1px solid green;
}

Any help would be appreciated.

Best Answer

The caption short-code changes to a paragraph (captions can be multiple lines)

li.postText p {
    display: inline;
}
Related Topic