This project started easy but towards the end I encountered a few problems, especially in the footer area, I could not put the contact information icons(location, phone, email) next to the contact information so I settled for a list style type: circle
Please suggest ways to put the icons next to the contact information.
I ran into different problems towards the end but I was able to rectify them feel free to look at my code and suggest better ways to attempt the project.
This challenge taught me a lot, especially in terms of how we're meant to structure the website from the markup(HTML) before we use CSS to make it as appealing and responsive as possible.
Feel free to look at my markup(HTML structure) and CSS code
I struggled a bit in this task especially setting the image to fit the container
even though I did a display grid on its container and a grid-template-columns: repeat(2, 1fr) to make both containers share the same width and height.
Feel free to suggest any other ways I could have approached the task.
From the design, you'll know that I found it difficult to set a background color on the image. I would have set the background image directly from CSS but we were given two images(one for mobile view and desktop view) so I had to use the picture tag to store both images and then tell it when to display one.
Please suggest ways to set a background color on an image.
I have a question tho, apart from setting a flex-basis on the container to display the image and its contents side by side. Are there any other ways to set them side by side
I am open to any feedback on how I can improve and reduce unnecessary code.