dkaffes
@dkaffesAll solutions
- Submitted 8 months ago
Testimonials grid section | grid-auto-flow: dense;
- HTML
- CSS
Is the use of the
q
element correct? Or is it more appropriate to useblockquote
? I believe that the text inside the quotation marks is considered a short quotation that doesn't require paragraph breaks.Any advice is welcome!
- Submitted 8 months ago
Social proof section | 3 Grids and some flexbox
- HTML
- CSS
I did not get the correct spacing as it is given in the design for the desktop version. When I try to emulate the cards width, the position of the title on the
background-image
breaks and vice versa. I need some advice that has to do with the spacing between the elements.I understand the difference between margin and padding but I would like some general advice:
- How much padding is too much padding?
- How much grid gap is too much?
When the spacing between elements is big, how should I approach the layout design?
- Submitted 8 months ago
Four card feature section with grid-template-areas
- HTML
- CSS
In my solution the
border-top-color
on each of the four cards looks a bit curvier compared to the design files. Do I miss something here?Thank you!
- Submitted 8 months ago
Product preview card | Responsive with Grid
- HTML
- CSS
- Accessibility: Is the way I deal with the `` tag correct? I use it for the deleted price part:
$169.99 The old price of the perfume in strikethrough
-
The CSS Reset (by Andy Bell) that I am using, removes only the
margin-block-end
part of the margins for elements like:body
,h1
,h2
etc. This results in elements that keep their user agent stylesheet. For examplebody
keeps a small margin on three sides (top, right, left) of 8px. I had to repeatedly set themargin-bottom
ormargin-top
using some utility class. Is there a better way to deal with this issue? -
I had to set to the
element the `display:inline` in order for the `object-fit: cover;` on the
element to work. Is this approach correct?
Any help is valuable!
- Submitted 9 months ago
Blog preview card with active states (CSS nesting)
- HTML
- CSS
Are there any comments related to the way I dealt with the active states of the interactive title element?
- Submitted 9 months ago
Huddle landing page - introductory section | CSS nesting
- HTML
- CSS
How can I fix the
:focus
state of the social icons?It doesn' t get the same styles (even though they are in the same declaration set) with
:active
and:hover
. In Firefox, focusing on the social icons looks ugly and focuses on the bottom half of the icons.