JSFiddle - React, Tailwind, and code Playground

by csssss

HTML

<table border="0">

{% for post in page.blog.most_recent_blog_posts limit:7 offset:0 %}

	<tr>

		<td style="vertical-align: top; padding-right: 10px;">

		{% for attachment in post.attachments limit:1 %}
        	<a href="{{ post.url }}"><img src="{{ attachment.url }}" width="150"></a>
		{% endfor %}

    	</td>

		<td style="vertical-align: top; padding-right: 10px;">

        	<div style="font-weight: bold; font-size: 14px;">
        		<a href="{ { post.url } }">{ { post.headline } }</a>
        	</div>

        	<div class="blog_teaser">
        		<div style="font-weight: normal; font-size: 14px;">
        		{{ post.blog_post.content | strip_html | truncatewords:35 }}
        		</div>
        	</div>

        	<div class="continue_reading">
				<a href="%7B%7B%20post.url%20%7D%7D">Read more</a>
			</div>
			<hr>
		</td>
{% endfor %}

	</tr>

</table>