Help Image cropping rather than shrinking on mobile [SOLVED]

[Saurosian]

Hey, I'm expecting this question has been asked before but I figured I could ask in case someone's able to answer before I find the answer myself.

I'm trying to make a code mobile friendly. It uses an image as the background behind text. Currently, when I switch to a mobile device the image shrinks to fit the screen while still being fully visible, leaving a blank space below it. Instead, I want it to crop so it retains its height but only displays, for example, the cropped vertical section of the image at its center.

Let me know if I need to explain myself better - I'm pretty sure I've seen this done elsewhere and just need to find it myself.

 

[Saurosian]

I figured it out! For anyone with the same problem, what I had to do was add these two things to the code:

background-size:cover; background-position:center;

I lifted it from this post's code, by Uxie:

Resource - 𝚑𝚊𝚟𝚎 𝚊 𝚗𝚒𝚌𝚎 𝚍𝚊𝚢 ♡ (freebies)

coded by uxie! please do not use w/o permission. have a nice day! ----right/top---- ----header---- ----* * * title here---- have a nice day ! ----* * * subtitle here---- uxie's freebies workshop ----header end----...

www.rpnation.com