Skip to content
OverviewSolutions
1
Comments
5
P
Leslie
@Dereemii

All comments

  • Leslie•110
    @DereemiiPosted over 1 year ago

    Great work! Only I would change the class name from the footer from "attribution" to footer instead, because if I go directly to the CSS files, I won't get a clue about which element is.

    Marked as helpful
    0
  • Leslie•110
    @DereemiiPosted over 1 year ago

    HI! About colors

    I would recommend you "color picker/colorzilla" extensions for google chrome, so you will get the exact same color as the UI requested.

    About assets

    I see you have some extra images added so maybe you should delete them so it won't affect your website performance. Then would recommend you to add a folder "styles" inside assets folder and inside add your css file.

    Avoid adding styles to html <tag> elements If your project will keep growing you maybe won't want to all the tags have the same style.

    Notes: it's ok to use a template or a boiler plate to begin a project but remember to remove all the stuff you are not going to use :) !

    Marked as helpful
    0
  • Leslie•110
    @DereemiiPosted over 1 year ago

    About structure

    I would recommend creating different folders to organize your project. Assets folder to add CSS and images

    About naming CSS classes

    I would recommend using descriptive classes. Try to fix the name "child" because if I go directly to the css file, I won't know which element this refers to.

    Avoid adding CSS styles to html <tags>

    If your project grows, maybe you will have new images, so add a class or use nested selectors to add a style for example container.child.img to select this tag

    Marked as helpful
    0
  • Leslie•110
    @DereemiiPosted over 1 year ago

    About css

    I would recommend create an assets folder and drag all your css there, inline style are not recommended, because it can makes your html file to long and hard to edit for other developers.

    About media queries

    I recommend using logical operators Link to css tricks

    About bootstrap

    I think you could export only the things you are going to use from the library, for example the grid, because it makes your project heavier c:. Try to pick only the stuff you need

    Notes Remeber to add the favicon

    Sorry if my english is not proper I hope I can help you

    Marked as helpful
    0
  • Dennis Herrera•150
    @KlonnisterSubmitted over 1 year ago
    • How would you vertically center the card in the page across all breakpoints?

    A way I can think of is to create a container with the total height of the viewport and use flex or position. Though I'd have to use some media queries.

    • Could you please share with me the screen sizes you take into account when programming (width and height)?

    I have my own breakpoints, but I'd like to see other people's as well.

    Thanks in advance :D

    QR code exercise using basic html and css.

    4
    Leslie•110
    @DereemiiPosted over 1 year ago

    How would you vertically center the card in the page across all breakpoints?

    • To center vertical and horizontal I used a container with 100vh , but first you have to normalize all the html elements with * box-sizing: border-box , margin & padding 0 so a scroll bar don't appear :), then set display flex, justify-content and align items to center :D hope this helps
    Marked as helpful
    1