Tell us what’s happening:
Hello, I am after a little bit of help. I have built the majority of the tribute page however cannot seem to get the pictures to align properly.
Problem 1 - The pictures down the left dont seem to sit up completely against the content div.
Problem 2 - The 3rd picture on the right doesn’t seem to sit up against the rest of them.
All pictures were edited to be of the same size to fit the page. All were the same width and I made sure there was enough to all match hight wise.
Thanks fixed the links but still seem to have a major issue with the images. Just checked it from my phone and its even worse. Thought I had it vaguely responsive but clearly not. Have I missed something?
She is my daughter, she is my motivation for wanting to achieve this and become a developer. It is what I have always wanted to do but never had the bottle to go for. I want to create a better life for her and teach her that dreams can come true no matter what your setbacks.
That aside what would your recomendations be then to be able to fit the images in a grid responsively? I managed to overcome one hurdle and get them to fit down the right hand side, however they are awful on the left and overlap the text… this makes no sense to me though as all the grid containers are set with the same CSS rules. Am I best off not using a grid style then?
That is because you specified “.img-div” for the class attribute on all but the first img element. When using the class attribute, you do not put the leading dot in front of it. That is only for defining the class in CSS. Not that it causing a problem per say, but img elements do not have a closing tag like </img> so you can delete all of those.
I believe once you resolve the problem above, it will fix whatever you were experiencing before.
Thank you so much, after a little tinkering its now resolved. Not sure why I specified .img-div. Goes to show that a little lapse in concentration makes a big difference though. Thanks for all replies.