9 replies

Grid gap having uneven gaps

So this is this grid wrapper:

<div className={styles.boxWrapper}>
          {boxElements && boxElements.map((box) => box)}
</div>

<div className={styles.boxWrapper}>
          {boxElements && boxElements.map((box) => box)}
</div>

here is each box element jsx: (boxelements is nothing but array of these :

<div key={index} className={${styles.box} ${boxClass}

<div key={index} className={${styles.box} ${boxClass}

} />

   )


css:

   )


css:

.boxWrapper {
display: grid;
grid-template-columns: repeat(53, max-content);
gap: 2px 2px;
}

.box {
width: 10px;
height: 10px;
background-color: white;
}`

idk what is causing this, any help would be appreciated

KP-C

Kevin Powell - Community•2y ago•

9 replies

Jus Sus || 💀

Grid gap having uneven gaps

So this is this grid wrapper:

<div className={styles.boxWrapper}>
          {boxElements && boxElements.map((box) => box)}
</div>

<div className={styles.boxWrapper}>
          {boxElements && boxElements.map((box) => box)}
</div>

here is each box element jsx: (boxelements is nothing but array of these :

<div key={index} className={${styles.box} ${boxClass}

<div key={index} className={${styles.box} ${boxClass}

} />

   )


css:

   )


css:

Grid gap having uneven gaps

Similar Threads

Grid gap having uneven gaps

Similar Threads

Similar Threads

Similar Threads