I have been building the Random Quote Generator and have added all the functionality . Only problem is when I resize it to a small device view, some of the text from the top gets lost if the quote is long. I can’t seem to get around it . Please help me with it !
Here is the codepen.io link - https://codepen.io/kshitij1234/pen/RVJYwG
Random Quote Generator - Some of the text is lost in mobile view if the quote is long . Please help!
Haiiiiyo.
The (major) reason is because you have applied absolute position to .quote-container and offset the container with transform: translate(-50%, -50%).
If having a scroll bar for longer quotes is not an issue then the simplest “fix” is to make .quote-container a flexbox, and justify and align the items accordingly with flex-display set to column. You will have to set the %width of .quote-text to get the original layout, too.
I hope that helps. 
Thanks a lot!!! It worked!!