@Oluwatosin0
Latest comments
- @JulienK94
first hi seeing your solution the first thing is you have to center the main container horizontally and vertically. To do it you set display flex to the body : ex: body { height: 100vh; set the height of the body to 100% of the viewport meaning 100% of the screen which helps aligns at the center vertically display: flex; justify-content: center; here align horizontally align-items: center; here vertically } SEcondly you need to align the element to the left, you have 2 possibilities first: text-align: left; second: with Flexbox using justify-content: flex-start; here i assume it's the basics flexbox meaning row so on mobile side you'll need to change also certain things . to help i have also a video you can watch: https://www.youtube.com/watch?v=3YW65K6LcIA&t=742s
Marked as helpful - @KNMR-GITHUB@JulienK94
hi your site is good on desktop side need also a mobile side so it can be responsive. for your background image you can use background-size: cover; so it takes all the viewport. the element containing the content must have a max-width depending on screen size. for your social icon u forget to give them a color depending if hover or not
Marked as helpful - @KTrick01@JulienK94
I personally submit he same project this morning i had the same problem but i pass it not great but cool. you must give the body a background-color of cyan; and a position: relative; after that you must have a main who is not a container just here to align the container of content with display flex, justify-content and align-items; main { position: absolute; background: url(link of top bg-pattern) no-repeat left 50% top 50%, url(link of bottom bg-pattern) no-repeat right 50% bottom 50%; } here values use near top left right and bottom are just examples just the exact values to well place this bg-pattern and you're not forced to use%. i wish that it will help you and happy coding.
- @xuseen90@JulienK94
i don't speak english i have seen your site it's pretty good. first when we pass on mobile preview the border-radius side of the element must change :
- border-radius can be used to define different radius for each specific side of the same element border-radius: 10px 0px 0px 10px; here the first value is for top-left, the 2nd top-right, the third for bottom-right and the last for bottom left
Marked as helpful - @xuseen90@JulienK94
your doc has not been correctly uploaded here so i recommend you this youtube video so you can do it the next time https://www.youtube.com/watch?v=RxJP-uJ_QmQ&t=3s
Marked as helpful - @codexshell@JulienK94
your project is good perhaps just add padding on the text part (right side )
Marked as helpful
