How do I give the input the remaining space?

For some reason when I put flex-grow: 1; on it it still doesn't grow and width: 100%; pushes the button down.

.submit-form {
        border: 2px solid red;
        display: flex;
        align-items: center;
        padding: 1.75rem 2rem;
        background: url(../images/bg-shorten-desktop.svg) no-repeat;
        background-color: $very-dark-blue;
        background-size: cover;
        border-radius: 8px;

        .form-input {
            padding: 0.75rem;
            border-radius: 8px;
            color: $dark-violet;
            border: none;
        }

        .form-btn {
            @include button(8px);
            margin-left: 1rem;
            padding: 0.75rem 2rem;
        }
image.png
Was this page helpful?