Use parent and child blocks in a for-loop, including variables - php

Question

Is there are way I can create an easily maintainable for loop in Twig that works with Bootstrap's layout?
I'm using bootstrap's row functionality, meaning that each row has a div of class "row". This makes things tricky in twig, because I have no way of entering these header divs.
For example, my main page will have several articles, and extends the skeleton template, as shown below. Is there any way I can use this skeleton base and use it multiple times in a for loop?
I've tried by adding the Article block, but it overrides everything inside. Do I have to create another template for this to work?
<div id="main" class="container-fluid">
{% block article %}
<div class="row">
<div class="col-md-3"></div>
<div id="title" class="col-md-6">
{% block title %}
{% endblock title %}
</div>
<div class="col-md-3"></div>
</div>
<div class="row">
<div class="col-md-1"></div>
<div id="left-nav" class="col-md-2">
{% block left_nav %}
{% endblock left_nav %}
</div>
<div class="col-md-6" id="content">
{% block content %}
{% endblock content %}
</div>
<div id="right-nav" class="col-md-2">
{% block right_nav %}
{% endblock right_nav %}
</div>
<div class="col-md-1"></div>
</div>
{% endblock article %}
</div>
How do I iterate and create multiple "Articles" in this context?
Using parent() isn't helpful because it'll just print the start and end tags, wheras I need them to be placed around the correct sections, otherwise the rows won't work.
In other words, in a for loop context, how can I change the values of variables inside child blocks within a parent block?
Apologies if this is unclear, I found it hard to put into words.
Edit:
I know the existence of for loops in twig, I am just unsure of how to implement a solution to this particular problem.
As a simple example of the skeleton template and its output:
Template
<div class="row">
<div class="title">
{% block title %}{% endblock %}
</div>
<div id="content">
{% block content %}{% endblock %}
</div>
</div>
Output
<div class="row">
<div class="title">
This is the first post.
</div>
<div id="content">
Post 1
</div>
</div>
<div class="row">
<div class="title">
This is the second post.
</div>
<div id="content">
Post 2
</div>
</div>

Answer 1

I found a solution that is fairly maintainable, as it still extends the skeleton template, but is flexible enough to support for loops inside a block.
Skeleton
<div id="main" class="container-fluid">
{% block article %}
<div class="row">
<div class="col-md-3"></div>
<div id="whitespace" class="col-md-6">
{% block title %}
{% endblock title %}
</div>
<div class="col-md-3"></div>
</div>
<div class="row">
<div class="col-md-1"></div>
<div id="left-nav" class="col-md-2">
{% block left_nav %}
{% endblock left_nav %}
</div>
<div class="col-md-6" id="content">
{% block content %}
{% endblock content %}
</div>
<div id="right-nav" class="col-md-2">
{% block right_nav %}
{% endblock right_nav %}
</div>
<div class="col-md-1"></div>
</div>
{% endblock article %}
</div>
Article list
{% extends 'skeleton.php' %}
{% block article %}
{% for post in posts %}
<div class="row">
{# Start title #}
<div class="col-md-3"></div>
<div id="title" class="col-md-6">
{{post.title}}
</div>
<div class="col-md-3"></div>
{# End title #}
</div>
<div class="row">
<div class="col-md-1"></div>
{# Start left-nav #}
<div id="left-nav" class="col-md-2">
{{post.left}}
</div>
{# end left-nav #}
{# Start content #}
<div class="col-md-6" id="content">
{{post.getBody}}
</div>
{# end content #}
{# start right-nav #}
<div id="right-nav" class="col-md-2">
{{post.right}}
</div>
{# end right-nav #}
<div class="col-md-1"></div>
</div>
{% endfor %}
{% endblock article %}

Answer 2

{% foreach article in articles %}
<div class="row">
<div class="title">
{{ article.title }}
</div>
<div id="content">
{{ article.content }}
</div>
</div>
{% endfor %}
Is the template assuming articles is an array containing arrays with keys title and content