Using Arc boost css file in my application
CDN friendly RGPD for font, js, etc
Position fixed with transform (behavior exploration)
Adding an dataset attribute to rendered div of mat-tab from Angular Material

Responsive container : max-width or padding ?
<section class="container"></section>
and ...React router dom is not redirecting to the route even though the url is changed
Seeking Assistance: Centering Issue with Flexbox Header
Jumping for character

Can some review my attempt at this coding challenge?

overflowing text in grid area

max-width media query not applying to max value
@media (max-width: 1023px)
is working on everything below <1022px, but at 1023px, it doesn't apply.
I have checked dev tools and confirmed this issue. There does not appear to be another media query (eg: @media (min-width: 1023px)
) being applied.
I know my issue is impossible to diagnose without code, but does anyone know general reasons why this could be happening? I read MDN and it should be applying <=1023....[React] How does this code look to you?
I have the following code how I can make contaniner_contant class closer to background_countainer
Background color changes dimensions ???
grid grid-cols-[repeat(3,min(50px))] grid-rows-[repeat(2,min(50px))] place-self-center gap-4
...
having a scrollbar without setting height
overflow-y: scroll
doesnt work unless I set height: 100vh
, which I cant do because it still takes effect when the menu is closed (the element is still visible, but not expanded).
Is there a solution that doesnt require js?...confusing info

How can I create a submission page?

Making a paragraph fit it's content
<p>
element, which I'd like to add a max width to, and also have text-wrap
set to balance
. However, applying these properties creates extra space on the right side of the element, which I'd like to get rid of. As you can see in the pen below, I've tried adding width: fit-content
, but it doesn't change anything. What should I do to fix this?
Here's a pen:
https://codepen.io/samalander0/pen/ZEPLjzm...
How to align the header and footer for a page

Centering absolute element above relative parent element
