Wrapping polymeric children in another element

I am trying to create a component that will wrap its children with some other part of the components or elements, here is a simplified example of my actual code, say I have developed a container element and I want to add a series of images to it content

(or shadow

it doesn't matter to me, i think), for example:

<!-- my-app.html -->
<my-container>
 <img src="a.png">
 <img src="b.png">
 <img src="c.png">
</my-container>

      

        
        
        
      

    

Now, behind the scenes, I would like to wrap each image with, for example, a different set of elements, so I define my polymer component my-container

like this:

<polymer-element name="my-container">
  <template>
    <link rel="stylesheet" href="bo.css">
    <link rel="stylesheet" href="bo-examplr.css">
    <h3>{{name}}</h3>
    <template bind="{{children as children}}" repeat="{{child in children}}">
      <div>
        <h5>Some Property will go here eventually</h5>
        <content></content>
    </template>
  </template>
</polymer-element>

      

        
        
        
      

    

That as far as I understood, and of course it didn't work, someone else tried it and was more successful than me?

The gist of the actual source code