Latest solutions
Latest comments
- @Belamana-HarshithaSubmitted 2 months ago@tarikraposoPosted 2 months ago
Layout looks good, does not include semantic HTML. You can improve visualization with paddings on your card. If you want to follow the layout strictly you can remove the last TR border with table tr:last-child {border-bottom: none;}. The code is well-structured, readable and reusable.
0 - P@dionysia-lemonakiSubmitted 2 months ago@tarikraposoPosted 2 months ago
Include semantic HTML; Its accessible, don't need improvements. Non-responsive; Readable and reusable; Very good, not differ from the design;
0 - @ArianMakiabadiSubmitted 3 months agoWhat are you most proud of, and what would you do differently next time?
doing everything from the scratch was quiet fun
What challenges did you encounter, and how did you overcome them?i noticed the children of a flex parent don't get the full width of their parent automatically even if they have a
display: block
, this can be solved by givingwidth: 100%
to the child element@tarikraposoPosted 2 months agoAccessible, non-semantic. Looks good on different screen sizes. Readable. Looks very good, just missing the box-shadow.
0 - @PattykevSubmitted 2 months agoWhat are you most proud of, and what would you do differently next time? What I learned
- How to auto values om margin properties :
In CSS, the
margin
property is used to create space around elements. When you set themargin
toauto
, it allows the browser to automatically calculate the margin space. This is particularly useful for centering block-level elements within their container.
Here's what
margin: auto;
typically means:-
Horizontal Centering: When applied to a block element (like a
div
), setting the left and right margins toauto
allows the element to occupy the available horizontal space equally on both sides, effectively centering it within its parent element..centered { width: 50%; /* or any other width */ margin: 0 auto; /* top/bottom margin 0, left/right margin auto */ }
-
Vertical Margins: The
margin: auto;
setting does not have the same effect for vertical margins (top and bottom) unless certain conditions are met (like using flexbox or grid layouts). -
Flexbox and Grid: In flexbox or grid layouts,
margin: auto;
can also be used to distribute space between items or to push items to the edges of their container.
In summary, using
margin: auto;
helps in controlling the layout and positioning of elements within a webpage, particularly for centering elements horizontally.- Remembered how to change local repository url
git remote set-url origin <put the new url there>
- How to insert an image with markdown
What specific areas of your project would you like help with?
In CSS learning.
@tarikraposoPosted 2 months agoO posicionamento dos elementos foi feito com flexbox; Os espaçamentos com padding 16px, respeitando o tamanho especificado no figma; Código bem estruturado e legível; A solução não possui HTML semântico;
Melhorias: ajustar tamanho do texto para o proposto no layout.
0 - How to auto values om margin properties :
In CSS, the