Feedback: My Tribute Page Project (Haruki Murakami)

Hi, I’ve made a tribute page for the responsive web design project: https://codepen.io/amandajehan/pen/RqQXpL

But I’m having a problem with the navigation top of the page (Learn More anchor element) & the CSS grid in the content section won’t be responsive if I open the webpage on smaller window (I tried to open it from my android smartphone) and they stretch horizontally. I solved the CSS grid by using minmax on grid-template-columns/rows but the grid items still a bit messy and not really nice to look (the images are resized but the font size remain the same), I’m not sure which part should I fix :thinking:

Can anyone help me with this? any feedback about the project would be welcome too :slight_smile:

1 Like

Hello! I like your tribute page! I don’t know if it’s useful but, with the font-size normally I use viewport values

h1 headings -> font-size: 5vw (viewport width)
h2 heading -> font-size: 3vw
paragrahps -> font-size: 1.5vmax

If you want more information, there is a excersice in the platform
Make Typography Responsive

Hope I help you with your problem.

1 Like

Thank you for checking my tribute page :smiley: I almost forgot about viewport! I will try your suggestion to fix it then, thanks!