single-price-grid

Hey Matthew,

Looks like in general everything sized out and looks in the right place for the most part.

• On the main-box ---> It's not centering for me, and it looks like you have both position: relative; and position: absolute; defined. For a box like that I might recommend doing display: block; margin: 0 auto; to center it in it's parent container instead of relying on transforms. Another cool way to do it is set the parent container display: flex; justify-content: center; align-items:center;

• I'd recommend putting box-sizing: border-box on your browser reset so you don't have to list it on every container.

• If you put font-family: 'Karla',sans-serif; on the body it will be inherited to the rest of the elements instead of having to list it in each of the elements you need it*;

• Generally it is not good practice to put inline styles in your HTML markup. Especially partial inline styles as is seen here. Keeping your styles in separate stylesheets will greatly assist troubleshooting when projects get large.

• Depending on where you are in your learning process I think this project is best completed with CSS Grid. Theres a few great grid tutorials on Udemy / Youtube and [CSS-tricks has a great grid reference sheet] (https://css-tricks.com/snippets/css/complete-guide-grid/)

Good Luck,

David

Hey David,

I see the main-box now! It’s supposed to be absolute and thats a mistake that just went past me. That would probably explain why I had so much trouble positioning it so thanks for pointing that out!

With the button, I totally agree and I didn’t want to use that inline style, but I was having trouble with the button. I think I’m just going to save myself the trouble and use a button generator.

I’m doing an Udemy Bootcamp that I love! It’s the ultimate web developer Bootcamp taught by Dr Angela Yu. The only thing is she teaches the bootstrap grid but not the css. So one day I’ll definitely check out a tutorial on how to use the CSS grid.

Again, thanks for the feedback

Matt