Custom, dynamic class name bind

[AlexAndrascu]

I'm trying to add a custom, dynamic class name using v-bind like so:

      <div class="column" v-for="card in cards" :key="card.title">
        <div :class="card.class">

but not getting the desired output. It works for other binds for example <div :classes="card.class"> works fine.
Any help / pointers would be appreciated.
The only reference to this I managed to find in the documentation was on #10214 although that wasn't very helpful either.

[pdanpdan]

Codepen

[AlexAndrascu]

[AlexAndrascu]

Ah. Sorry, I didn't know what you mean. I don't use codepen, I did show above what I've tried and what's not working including what is working :)

not working <div :class="card.class"> outputs <div class> vs
working<div :classes="card.class"> outputs <div classes="6">

[pdanpdan]

You showed nothing. It's 2 lines of basic Vue html template, with no description of what is in the variables, what is not working, anything.

[TobyMosque]

it's still not too late to learn the art of how to use the codepen.

[AlexAndrascu]

https://codepen.io/alexandrascu/pen/NWYazdg

[pdanpdan]

Html does not allow numeric class names