@AdrianoEscarabote
Posted
Hi Brian, how are you? I really liked the result of your project, but I have some tips that I think you will enjoy:
To prevent the background image from breaking at higher resolutions, we can prevent this in two different ways:
-
Add a
background-repeat: repeat-x;, the image will repeat on the horizontal axis, preventing it from breaking. -
Add a
background-size: 100% 50vmin;, the50vminwill set its height as the page target, and100%will make it stretch on the horizontal axis.
Feel free to choose one of the two!
I noticed that you used relative units of measurement in higher resolutions, prefer to use absolute units so that the content does not vary in size depending on the resolution, leave the relative units for lower resolutions!
The rest is great!
I hope it helps... 👍
Marked as helpful
@briangesteban
Posted
Hi @AdrianoEscarabote! I'm doing fine and currently learning more. I really appreciate the feedback. It fix the breaking of the background image. Also noted on use of units of measurement for bigger displays. These tips really help me a lot, thank you so much!
P.S. Just a question, I've noticed the text gets blurry on the Plan/Pricing part when the horizontal scroll bar is visible. Do you know a fix for it? I can't seem to find an answer, the only thing I found is the cause which is the border-radius.
