All comments

• 

  Josephine Fitalvo•260

  @fitalvojosephineSubmitted 9 months ago

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

  Grid and responsiveness of the design. I need to keep on practicing and practicing to make this precise. Because some of the industry they need an accuracy and perfect pixel.

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

  I want to make the design as precise as possible. However, I have an issue with a group of images. I want to separate them and use a grid layout for each one on both the right and left sides.

  Please provide feedback and help me simplify this. Thank you.

  

  Meet Landing Page

  #bem

  2

  30
  

  P

  Jamie Reed•120

  @jreed-11Posted 9 months ago

  Hi,

  I j=was Just looking at your meet page and there is a problem when you start to resize the window smaller. The hero section has overflow.

  Jamie

  1
• 

  P

  yoyov51234•240

  @yoyov51234Submitted 11 months ago

  What are you most proud of, and what would you do differently next time?

  1. I didn't give up. I made it.
  2. The code is heavy for different screens, aslo it's a small project, but I've already feel the file management is out of control, need to work on this.

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

  1. For the same font, same size, same padding, same line-height, the paragraph's layout is different from the design, I looked for other devs code, and learned I can user padding to make the style.
  2. Used BEM, but not good at defining elements. Will check codes of others to learn.

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

  For example, I have a container with 1000px width, and i give this container a gray background, then some content inside the container. When resizing the screen, sometimes the issue occur that the content is outside the container, any suggestion to prevent this from happening? I tried max-width:100%, but it seems doesn't work.

  

  Meet landing page

  #bem

  1

  10
  

  P

  Jamie Reed•120

  @jreed-11Posted 11 months ago

  Hi Yoyov, First of all ood effort with this project it had many challenges to overcome and tested a lot of skills to acheive the layout. To answer your question about some content outside the container. Its becuase you are using fixed units 1000px for max with is not dynamic. Try changing px to rem for example.

  The hero section with the imageswas tricky i notice yr images a cut of tp and bottom. To achive the design layout you use padding to move each image up and down and Object fit /poistion to reposition the image as the design shows the image is cut off right and left. Again the hero container should be in dynamic units like rem not px. Becuase your hero container is in px it is cut off top and bottom and the container can't adjust its self based on the content inside. see here at my soloution https://jr-meet-landing-page.netlify.app/.

  Apart from the hero section you done pretty well. Only other thing i would suggest is really look at the sizes onthe design (widths) as your layout is eaxcatly the same. Again when set widths for containers don't usestatic units like px as they can't grow and shrink based on the content inside the container.

  Hope this helps

  0
• 

  P

  Jamie Reed•120

  @jreed-11Submitted 11 months ago

  What are you most proud of, and what would you do differently next time?

  Really proud of this project and on geting the layout close to the design using different CSS techniques

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

  only a few on how to use CSS grid and ordering items in flex mode so i searched for the solution and solved the issues

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

  N/A

  

  Responsive CSS Grid and Flexbox skills

  2

  50
  

  P

  Jamie Reed•120

  @jreed-11Posted 11 months ago

  Hi Krishna,

  Thanks for your kind feed back

  CSS Flexbox see - https://css-tricks.com/snippets/css/a-guide-to-flexbox/ Css Grid see - https://mozilladevelopers.github.io/playground/css-grid/

  These useful site may help

  0
• 

  P

  RadaidehDaniel•430

  @RadaidehDanielSubmitted 11 months ago

  What are you most proud of, and what would you do differently next time?

  Nothing

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

  Nothing

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

  Is it possible to make a responsive layout in this challenge without using Media Query?

  

  Testimonials grid section

  1

  40
  

  P

  Jamie Reed•120

  @jreed-11Posted 11 months ago

  really good effort and near perfect to the design. Made great use of flexbox and grid to get the desktop and mobile layout. The only thing i could point out is the mobile design the cards need to be less width so more square. all in all a great effort

  There is a new way to get a responive layout without media queries and that is @container queries - reference here https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_containment/Container_queries

  Marked as helpful

  1
• 

  Donovan Romero•100

  @nsvonod12Submitted 11 months ago

  What are you most proud of, and what would you do differently next time?

  Practice my CSS skills

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

  I didn't remember how to arrange the cards

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

  At the moment, none

  

  Four card feature section - CSS Grid

  1

  60
  

  P

  Jamie Reed•120

  @jreed-11Posted 11 months ago

  Nice try with this project and i see you used made good use of grid for desktop and flex for mobile and using custom CSS properties with custom varibles. only advice i could give was is getting the correct width of the Card and title containers slightly bigger than desgin. maybe USe rem units rather than %.

  To set the oder of the flex items you can use the order property see here https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flexible_box_layout/Ordering_flex_items to rearrange the order of the flex items.

  Overall good effot just the width sizes needed to be a bit smaller.

  1
• 

  SandyAstorga•460

  @SandyAstorgaSubmitted over 1 year ago

  What are you most proud of, and what would you do differently next time?

  .

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

  .

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

  .

  

  Product Preview Card Component

  1

  50
  

  P

  Jamie Reed•120

  @jreed-11Posted 11 months ago

  Hi Sandy,

  Really clean solution and looks like the design. Love your use of the custom varibles for the colors and like how you added the box shadow at the bottom of the card. Responsivness from Desktop to mobile is slick and great use of flexbox to achieve it. All in all keep up the good work

  1
• 

  sorravich lakngoenchai•20

  @6633256621Submitted 11 months ago

  What are you most proud of, and what would you do differently next time?

  this is my first time css norm i use tailwind in react

  

  Sorravich Recipe

  1

  20
  

  P

  Jamie Reed•120

  @jreed-11Posted 11 months ago

  Really nice work and nearlt to design. There is a soze differnce in your solution overall to the design given. So my only advice is to try can keep to the size persepctive of the design

  0
• 

  João Victor Souza•150

  @JoaoVictodevSubmitted 11 months ago

  What are you most proud of, and what would you do differently next time?

  I wouldn't do anything differently

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

  none

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

  I already knew what I needed to develop the application, so I don't need any help.

  

  Social Links Display-flex

  1

  50
  

  P

  Jamie Reed•120

  @jreed-11Posted 11 months ago

  Really good effort and close to desgin.

  Code reviewed and seems good to me.

  Well Done

  0
• 

  P

  Omair Majid•100

  @BigO-DevSubmitted 11 months ago

  What are you most proud of, and what would you do differently next time?

  I thought this was a simple, straightforward project, ideal for beginners. If I had to do things differently, I would try to organize my CSS better.

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

  The challenge was making sure it was responsive. I was able to achieve this by making the width of the card a percentage and by using rem units.

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

  I'd appreciate any feedback on how I could improve and advice on using best practices.

  

  QR code component using HTML and CSS

  2

  40
  

  P

  Jamie Reed•120

  @jreed-11Posted 11 months ago

  Code attepemt and very smilimar text need to be a bit larger but all in all a god attempt

  0