Skip to content
OverviewSolutions
8
Comments
5
Alphonzo Escolar
@phonzdev

All comments

  • Alphonzo Escolar•120
    @phonzdevPosted almost 4 years ago

    Hi Giancarlo! Use the background-image property. Use this as your reference!

    Don't forget to upvote comments you find helpful! :D

    Happy coding!

    0
  • Nikka Ella•40
    @nikkaellaSubmitted almost 4 years ago

    Hi,

    I'd like some feedback on how to keep the main profile area in the middle of the screen, regardless of size. It's currently hard-coded for mobile and web, so if a mobile user with an iPhone X looked at it, it'd be off-center.

    I would also like some more feedback on improvements I can make.

    EDIT: I made some improvements with the help of the comments, and it looks much better now! I learned Bootstrap and it made everything so much easier. I tried to use less absolute positioning, but they're still used for the profile photo :/ . Any constructive criticism is still welcome!

    Profile Card Component using Bootstrap

    2
    Alphonzo Escolar•120
    @phonzdevPosted almost 4 years ago

    Hi Nikka! I hope you're doing well! Here are my suggestions after reviewing your code:

    -It is considered best practice to separate structuring the content (HTML) with presentation (CSS). This means that the two background patterns (which are covered by presentation) would be better if inserted using the background-image property on your stylesheet.

    -Learn semantic HTML to make your webpage more meaningful.

    -check out and learn BEM

    -it's considered best practice to build on mobile design first then move up and adjust your styling using media queries.

    Keep up the good work and keep on practicing! Don't forget to upvote comments you find helpful :D stay safe!

    2
  • Alphonzo Escolar•120
    @phonzdevPosted almost 4 years ago

    Hi @MojtabaMosavi, love the responsiveness on this one!

    Here are a few things I'd recommend reviewing after taking a look at your code:

    -use wrapper to contain the whole three boxes and set a max-width on it so it doesn't expand to the whole width of the browser

    -on the "Why Us" section, I'd recommend using the <ul> tag to make it more meaningful :)

    Keep up the good work! Cheers!

    0
  • Alphonzo Escolar•120
    @phonzdevSubmitted almost 4 years ago

    Hey guys and gals! I'd very much appreciate if you would take the time to review my code :) please tell me how I can improve! I want to learn more about best practices and I would want my foundations to be solid. Thanks!!

    Mobile-first solution using Flexbox and BEM

    3
    Alphonzo Escolar•120
    @phonzdevPosted almost 4 years ago

    Thanks @SzymonRojek for your feedback! :) With regards to adding focus to a link, do you mean the pseudo selector?

    0
  • Alphonzo Escolar•120
    @phonzdevSubmitted almost 4 years ago

    Hey guys! Please give me a brutal, honest feedback. I seek the truth :D I really want to improve. I would love to improve on best practices. I would want to establish my foundations. I'd be grateful for any feedbacks! :)

    Mobile-first solution using Flexbox and BEM

    3
    Alphonzo Escolar•120
    @phonzdevPosted almost 4 years ago

    Thanks @mattstuddert for your feedback! I appreciate it! :) I was a bit confused on building this challenge. I am using the Responsively app to view the web page on different resolutions. I am using a 1366 by 768 laptop. When viewing this challenge on the Responsively app on 1366 it was okay, but when I tried viewing it on chrome it didn't appear as it was on Responsively. When I checked the viewport of my browser, it was 1366 by 695. My question is, should I build my website based on the viewport of my browser? I wasn't still able to find an answer on this one.. thanks so much Matt!

    0