@davidomarf
Posted
The mobile version scales perfectly, and the desktop version works great on the intended width, but looks funny on the intermediate widths.
Also, the social icons appear at the middle of the screen when the height of the viewport is higher.
I think you could achieve a more responsive layout if you separate the "main" containers in three: The navbar, the content, and the footer. Then you display them in a flex container with a height of 100vh, and that justifies its content as space-between in a column.
In tall screens, the background looks cropped. To prevent that, change background-size from contain to cover.
I really like that your content is capped to a maximum width.
@bashiroglu
Posted
Thank you very much @davidomarf, I absolutely agree with you those problems are exist. These solutions are done 3 4 weeks ago, it was the beginning of my CSS journey. I prefer to go new challenges rather solve these again. I will come back to make these perfect. Any your common will be very helpful
