@shashreesamuelSubmitted about 3 years ago
Latest solutions
Latest comments
- @MabchirPosted about 3 years ago
Overall it looks pretty neat ! Good Job!
Areas of improvement:
- Maybe centering things in a way that you won't need to scroll on the 1440 screen to see the copyright sentence
- You can use flexbox for the group (or notify me section), you easily adjust it for smaller screens my favorite flexbox guide I use in all projects
- Social media icon border you can use the following attributes:
- border: 1px solid gray;
- border-radius: 25px;
Marked as helpful0 - @shashreesamuelSubmitted about 3 years ago@MabchirPosted about 3 years ago
Great job on :
- using rem instead of px
- using intuitive class names
- guessing the fonts and font sizes! (I am sure if you had the figma file it would look just like the original design)
- using the root variables for style variables
- resetting your styles before adding your own styling!
Areas of improvement:
- The background image can be add using the following:
body { background-image: url('w3css.gif'); background-repeat: no-repeat; }
- The container_subtitle was closed by a h2 tag instead of h1
- avoid using <br/>, instead play with the margins or padding
- avoid leaving alt empty, you can describe it instead
- for the logo alt don't forget to add the name of the product/brand in addition to the description
- responsiveness can be a bit better - maybe it will help if you started with the mobile design before the desktop? I was recently given that advice. I tried it and made things much simpler.
- you can change the image source for the container image instead of changing the height. that will be better for the user's phone while downloading the page. (instead of downloading a huge image size, they download the small mobile-friendly one)
Marked as helpful0
