« recipes

Feel free to use, modify, and re-share this code anywhere you like. Credit is appreciated but not required! Background image from Wikimedia Commons and is free to use if you'd prefer to save it and upload it to your own server to prevent future deadlinking.

You might want to play around with the font sizing and line height on this one depending which font you use. I recommend using 'em' rather than pixel size so it adjusts according to the screen. So far, I've only figured out how to make the lines match up with the br tag rather than the p tag, but if you know how to get around that, let me know!

Here's the same card tilted in the other direction. Make sure to change out the font family too!

This code is for both recipe cards and can be pasted wherever you want the cards to appear. Simply edit the code to remove one box if you only want to use one.

If you'd rather add the css to your stylesheet, you can find it below. To add it to the visual part of your website, use the div tag's class property.