Skip to content
OverviewSolutions
1
Comments
5
Andrew Allen
@AdditionAddict

All comments

  • gen5020•10
    @gen5020Submitted about 1 year ago

    Llevo poco más de una semana aprendiendo HTML y CSS. No pude centrar el div, por mas que use grid, flex, y probé varias opciones más para intentar hacerlo. Esto fue lo mejor que pude hacer por el momento. Espero seguir aprendiendo. Y poder mejorarlo.

    QRcode responsive

    1
    Andrew Allen•10
    @AdditionAddictPosted about 1 year ago

    To center a child element inside a div:

    div {
  display: flex;
  justify-content: center; // along primary axis (default x)
  align-items: center;  // along secondary axis (default y)
}
    0
  • Colin Meehan•40
    @ucolinmeeSubmitted about 1 year ago

    Although I have been learning HTML and CSS for a while, I felt most of my coding experience was through tutorials. I wanted to escape tutorial hell, so this is one of the first times that I have built a project from scratch. I chose a simple challenge first so as to not get demoralized and over-confident, but I still ran into some challenges that I had to google search while building this. More specifically:

    1. How do you center an image in a div (I found myself calculating the values manually for the padding-top so the spacing looks even all around the 4 edges of the image, so maybe there is an easier way to resolve this)
    2. How do I check what fonts/colour codes are used in the final solution preview? I ended up using colour hunt to get the rough colour but I am slightly colour deficient LOL

    Overall, good challenge and I am excited to try more challenges in the future and escape tutorial hell!!!

    Frontend Mentor QR-code Challenge

    3
    Andrew Allen•10
    @AdditionAddictPosted about 1 year ago

    For 2 you can use the provided figma files (not sure about sketch). Figma has added a developer view so you can inspect the css. The style guide has the font details.

    0
  • Andrew Allen•10
    @AdditionAddictPosted about 1 year ago

    Very good!

    Just needs the box shadow on the main card to make it pop box-shadow: offset-x offset-y blur-radius spread-radius color Out Of Boxes, Shadows Cast

    Values are in the figma file

    0
  • David•50
    @DavedCNSubmitted about 1 year ago

    On desktop mode when the "dismiss" button is pressed, the layout returns to the mobile view. I am unsure why this happens and the way I found to fix it was to use "location.reload()". I would appreciate if anyone could explain why this happens.

    Criticism on any part of my code is highly welcome.

    Responsive Page using Flex Box ,SASS and JavaScript

    1
    Andrew Allen•10
    @AdditionAddictPosted about 1 year ago

    On mobile so can’t run code but I’d have type=“button” on the dismiss button. type=“submit” is usually paired with a form and immediate posting of data to the server causing a refresh. A lot of web frameworks that implement forms do a preventDefault because it isn’t the 90s anymore and php use isn’t so prevalent

    0
  • Valles•10
    @JuanVallesChavezSubmitted about 1 year ago

    Qr

    1
    Andrew Allen•10
    @AdditionAddictPosted about 1 year ago

    From the figma file box-shadow: 0px 25px 25px 0px rgba(0, 0, 0, 0.05);

    Other than that it's looks spot on. Well done

    1