- This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
Viewing 3 posts - 1 through 3 (of 3 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Hi :-)
I have 2 issues with grid here. First is with padding in the cell. Second is with grid-gap fixed value.
I am trying to create 4 column grid. First and second cells (teal, red) should disappear when resizing and there is no space for them. This should be done with FR unit. It normally works. Except when I add padding inside them.
Is there a way to make padding disappear when resizing the window/screen?
Second problem is when I remove padding from cells. Now there is a problem with grid-gap. Grid-gap is set to 1em, so even if teal and red cells disappear, there is still this gap sized 2em on the left side. I was thinking about grid-gap minmax(), but it doesn’t exist. Is there a way to make grid-gap disappear when resizing a window/screen?
LINK TO CODE https://codepen.io/Robovision/pen/GRKWKMY
It should have no media query. To write % instead of em is not solving the issue as the gap is still there just smaller.
Thank you for your time.
First thought, something is not empty if it has internal padding….so you’d need to remove it.
Second though, not using media queries is unreasonable in modern CSS. It web development…not magic
I asked here because I had no idea how to put code in stacked overflow. People did it instead of me and got satisfying good answer. Here is a link https://bit.ly/2MErAn6
Thank you for your thoughts Paulie_D. For padding seems media queries as the best solution.