Any tips on how I can improve CSS I wrote for a digital playing card?

[seanritner]

Well, it’s not a playing card per se – it’ a spell card for Dungeons and Dragons – but anyway here’s what I wanted to recreate: http://imgur.com/LRP0HuP

I know enough HTML and CSS to get around the basics, but I can’t help but think there’s a better way to do what I did.

My goal is to also learn Javascript and make a card generator so I started to layout the card here:

See the Pen Spell Cards by Sean Ritner ( @seanritner) on CodePen.

[tomnoble92]

Hi Sean,

I coded my own version.

http://codepen.io/tomnoble92/pen/xRjaVK

See what you think, I did it a different way from, you see if you can take anything from it.

I used the CSS BEM methodology and tried to be as semantic as possible.

[seanritner]

Thanks tomnoble92

I see some things that I find helpful, and I’ve never heard of BEM before so that gives me a good direction on something new to learn.

Thank you very much for your time and help

[tomnoble92]

No problem, If anyone can rewrite mine and improve it showing me more efficient ways that would be great.

[Author]

Posts