Asking for feedback – Tribute page

Hi everyone! I’m writing my first ever post to ask for feedback on my first ever coding project; a tribute website. :slight_smile:

Please don’t hold back, I’m here to learn so any critical thought is appreciated!

Thank you so much in advance.

Great first project, but the page has a bit of white space on the right side of the page on smaller screen widths.

image

Also reduce the padding of the passage and font size of the passage and the quote for smaller screens, as there are very few words on each line and too much scrolling for mobile devices.

1 Like

Thank you so much for your comment!

I’ve adjusted the padding and font size, but I cannot reproduce the white space issue neither on my phone, nor by resizing the browser window on my laptop. :confused: The header image is set to width: 100%, so I really don’t know what the issue could be.

1 Like

The white space is created at browser widths below 300px, a horizontal scroll bar comes up below that width which hides the white space. It is created due to the ‘img-caption’ as it has its font and padding defined in absolute terms. You can add ‘overflow-x: hidden;’ to your body css to completely eliminate the scroll bar but it cuts off the quote. Try reducing the font size of the ‘image-caption’ a bit more for smaller screens.

1 Like

Thank you so, so much! :slight_smile:

1 Like