Skip to content
OverviewSolutions
17
Comments
5
impiia
@impiia

All comments

  • impiia•400
    @impiiaPosted 7 months ago

    Hi, does anyone know why Vercel refuses to display SVG in the background? Everything works fine on localhost 🤷🏼‍♀️

    0
  • fl1jason•10
    @fl1jasonSubmitted over 1 year ago

    I have to confess someone sent me the graphic and I just built it by eye, only when I got a link to the example did I see the correct fonts, colours and assets! :-P

    Thought I'd submit it anyway, then at some point I'll re-work it with the correct colours and assets ;-)

    CSS Score Challenge

    2
    impiia•400
    @impiiaPosted over 1 year ago

    Perfect in Terms of Styles and Colors, only all 4 points in your solution are the same "Reaction", while in the source code they are different: "Reaction", "Memory", "Verbal", "Visual"

    0
  • Mygaverse•150
    @MygaverseSubmitted over 1 year ago

    I thought it was an easy challenge, but it took me quite a while to achieve the final result. There were some small issues with the layout and styles. I had to make several different approaches to the result. I did some reseaches and examples over the internet. I finally found a similar design that I could reference to. There are many techniques and skills that I can apply to my future projects. ps: I found there is a line of border around the left column. I haven't figure out where it went wrong. Let me know if you know how to fix it. Thanks!

    Results Summary Component Solution

    3
    impiia•400
    @impiiaPosted over 1 year ago

    Hello! You've done a great job! Regarding the white line of border around the left column, you are using Bootstrap, which already has some styles. You are using the card class <div class="card">, and Bootstrap has a class called .card which already applies some styles, including the border around the left column (--bs-card-border-width: var(--bs-border-width);). In your code, you are overriding the .card class, but the styles applied by Bootstrap remain. To resolve this, change the name of your class to something else (for example, "my-card" in both the HTML and CSS), and the white line around the left column will disappear.

    2
  • Andrea Iriarte•130
    @andrea-iriarteSubmitted over 1 year ago

    I had trouble with the background image. I sit the width to 100vw so that it could respond to changes in screen width, but I was unable to get rid of a sliver of margin along the top and left of the image. Can anyone help with that?

    I wanted to switch between the desktop and mobile patterns using the <picture> tag, but could not get the <source> tags to work on react. Has anyone resolved a similar issue?

    Order summary component using React and CSS

    1
    impiia•400
    @impiiaPosted over 1 year ago

    Hello, you did a great job! By default, all elements have some styles applied to them, and the body element has a default margin. Let's reset it to zero:

    body {

    margin: 0;

    }

    This will remove the default margin, allowing you to have more control over the layout. Keep up the good work! Feel free to customize the styles further to match your design preferences. You're doing an excellent job, and your attention to detail will make your website even more impressive. Keep learning and experimenting with different CSS properties and techniques. Good luck with your future endeavors!"

    Marked as helpful
    2
  • impiia•400
    @impiiaPosted over 1 year ago

    Hello! I wanted to commend you on your excellent solution and idea. It works really well overall. However, I noticed a small issue: when I resize the screen to the mobile version, open the burger menu, close it, and then restore the screen to the desktop size, the app bar seems to disappear. Keep up the great work!

    Marked as helpful
    1