How do I get rid of the second block in this DIV

Question

I’ve got to be missing something.

Can anyone advise how to get rid of the block on the right (SEE SCREENSHOT)? I simply want the search box display the full width and some reason (I can’t figure out why) it’s compacted in the block on the left.

<v-row>
  <v-col>
     <ais-instant-search :search-client="searchClient" index-name="brands_index">
        <ais-configure :hitsPerPage="5" />
        <ais-autocomplete>
          <div slot-scope="{ indices }">
            <v-autocomplete
              placeholder="Type your brand name here..."
              v-model="brand"
              filled
              :items="indicesToSuggestions(indices)"
            />
            <v-autocomplete label="Components" :items="components"></v-autocomplete>
          </div>
        </ais-autocomplete>
     </ais-instant-search>
   </v-col>
 </v-row>

Answer 1

I figured it out... in case anyone else runs into the same issue - watch out for this guy in your style tag. I must have copied it from an example and forgot about it.

.ais-InstantSearch {
    display: grid;
    grid-template-columns: 1fr 2fr;
    grid-gap: 1em;
}