How to make second column take whole space ?

[keen laurel]

grid-template-columns: 216px auto;

[visual valley]

grid-template-columns: 216px 1fr;

[keen laurel]

ashahah, tried everything except it, so damn stupid xd

thanks )

[keen laurel]

oh, btw, how to make it not-growable, i meant when text gets bigger it grows horizontally

[visual valley]

That depends on what you've put in there... Did you put an input or textarea or something? Can you share a scrim?

[keen laurel]

just a text

@use "../variables" as *;

.item_wide_wrapper {
  display: flex;
  flex-direction: column;
  width: 60%;
  margin: 50px auto;

  .item_wide {
    width: 100%;
    margin-bottom: 20px;
    min-height: none;
    max-height: 230px;
    border: 2px solid $border-color;
    background-color: $secondary-color;
    padding: 15px;
    border-radius: 6px;
    color: $text-color;
    cursor: pointer;
    transition: 0.2s;
    position: relative;
    display: grid;
    grid-template-columns: 216px 1fr auto;
    column-gap: 15px;
    justify-content: flex-start;
    overflow-wrap: break-word;

    // grid-template-rows: 1fr min-content;
    .item_info {
      display: flex;
      flex-direction: column;
      justify-content: space-between;

      p {
        font-size: 1.1rem;
      }
    }

    .price_heart_container {
      display: flex;
      flex-direction: column;
      justify-content: space-between;

      b {
        align-self: flex-end;
      }

      .like_icon_container {
        align-self: flex-end;
        &:hover {
          &:before {
            display: block;
          }
        }

        .like_icon {
          width: 26px;
          @include no_copy;

          &:hover {
            fill: $text-color;
          }
        }

        &:before {
          content: "Add to favorites";
          bottom: 41px;
          right: 15px;
          display: none;
          position: absolute;
          background-color: $accent-color;
          border-radius: 4px;
          padding: 8px;
        }

        &[data-isfavorite="true"] {
          &:before {
            content: "Remove from favorites";
          }

          .like_icon {
            fill: $text-color;
          }
        }
      }
    }
  }
}