Responsive Order Summary Card Component Using Flexbox

Hello friends :D,

I got a few questions:

1. I had trouble positioning my background image especially getting it to stretch the entire view-port width. After researching I came background-size: 100%;, and it worked out! Is this the correct approach? Is there a way to position background-images absolutely?

2. For the subscription plan section the "Annual plan and $59.99" had to be right-aligned so I initially set the div to display:flex and then set flex-grow: 1 for the "Annual plan and $59.99" div and used text-align: right. This worked out well. I was wondering is there were other methods people used to attain the same result/layout.

3. So far this challenge was my hardest, If there's anything I haven't mentioned above and need to Improve on please let me know. (best coding practices etc...)

THANKS IN ADVANCE (: