Skip to content
OverviewSolutions
4
Comments
4
BegShoo
@BegShoo

All comments

  • razanabbas•150
    @razanabbas
    What are you most proud of, and what would you do differently next time?

    I am not very proud of my work this time.

    What challenges did you encounter, and how did you overcome them?

    This one was difficult especially that I didn't have the Figma file. It also requires the use of a variety of html elements like lists and tables which I'm not comfortable using yet.

    What specific areas of your project would you like help with?

    I would like to receive help in three areas:

    1. How can I make the list bullets and numbers colorful? I didn't know what selector to use.
    2. How do I make borders between border rows? (except for the last row?)
    3. I am getting a little bit confused about when to use specific units of measurement. When should I use relative units, percentages, and pixels? If someone can briefly explain it to me..

    Recipe page using html and css

    1
    BegShoo•80
    @BegShoo

    I'm pretty new at this too! But here are the solutions I used for the questions you have:

    1. For the bullets I actually removed the <ul> styling and inserted them in the html using entities. You can search them up. I then styled those in CSS. For the numbers, I replaced the <ol> numbers with a counter (I searched this up on w3schools), but essentially you place them using a pseudo element (::before) and then position them absolutely. You can style these like any other thing in CSS.

    2. I had to search this up too, but you can style tr, td and th like anything else, add border-bottom.

  • BegShoo•80
    @BegShoo

    Layout looks good, possibly a little cramped but overall good. Media queries do something a bit weird at about 900px. I cannot see the code as the github 404s unfortunately.

    Marked as helpful
  • BegShoo•80
    @BegShoo

    Layout is mostly there, some of the spacing is a little off but that can be easily sorted by looking at the Figma file!

    The card itself is a little tall, and the author image isn't visible and the name is also centrally aligned.

    The colors and font sizes look correct though which is great!

  • BegShoo•80
    @BegShoo

    Other than the border radius and text being ever so slightly off, the code (at least to me) looks great! Possibly the shadow is a little off on the Y axis, but that is nit picking.

    CSS is all laid out well, good job on putting the design guidelines up top, and also in the HTML it all looks good! I like the 2 divs wrapping the QR code image and the text, I didn't do that, and then using flex to align.

    Marked as helpful