3rd Project - Single-Price-Grid-Component

1. Grid containers in one column for the mobile version

• It took me a while to figure out how to convert the desktop version into a mobile version 3-row container, however just one property display: block; was needed to make all containers align into one vertical line.

2. Padding increasing inside button element

• I struggled with styling padding in the button element. I tried to increase the padding on the left and right, but it caused the word "up" to be below the "Sign" I simply figured out that the property white-space: nowrap fixed the issue. Even tho a couple of times happened that when I tried to increase the padding of the button I could not do it, even after refreshing the page. I am trying to figure out why.

3. Make paragraph and word "per month" different colour

• I could not figure out how to change the colour of those elements. I tried to change colour, I tried to decrease font weight, but then I found out about property opacity: and changed it to opacity: 0.5;