Блог

У меня есть блок кода с рекомендуемым макетом в соответствии с документами vuetify, и я ни за что на свете не могу понять, почему все, что я <v-flex> делаю, не отвечает offset . Ниже приведен код со скриншотом:

  <v-layout v-show="expanded"  v-for="(row, index) of queryCopy.query_parts" :key="index" align-baseline justify-start row fill-height wrap>
          <v-flex  offset-xs7 sm1 mx-3>
            <v-select
              class="whtsp-nowrap"
              label="Condition"
              v-model="row.condition"
              :items="options.condition"
              item-text="display"
              item-value="value"
              @input="isRowComplete"
            ></v-select>
          </v-flex>
          <v-flex sm1 mx-3>
            <v-select
              label="Field"
              :items="options.fields"
              item-text="display"
              item-value="value"
              v-model="row.field"
              @input="isRowComplete"
            ></v-select>
          </v-flex>
          <v-flex sm1 mx-3>
            <v-select
              label="Operation"
              v-model="row.operator"
              :items="options.operator"
              item-text="display"
              item-value="value"
              @input="isRowComplete"
            ></v-select>
          </v-flex>
          <v-flex sm2 mx-3>
            <v-text-field
              label="Search Value"
              v-model.lazy="row.value"
              @input="isRowComplete"
            ></v-text-field>
          </v-flex>
          <v-flex shrink>
            <v-btn @click="removeQueryRow(index)" class="mr-0"small icon>
              <v-icon color="grayDE">clear</v-icon>
            </v-btn>
          </v-flex>
          <v-flex>
            <v-btn  @click="addQueryRow" class="ma-0" small icon>
              <v-icon color="primary">add</v-icon>
            </v-btn>
          </v-flex>
        </v-layout>
 

мой вопрос касается первого гибкого окна, в котором есть offset-xs7 экран sm , поэтому он должен применяться (я также пытался изменить его, но безрезультатно).
Раскрывающийся список условий должен быть смещен, чтобы соответствовать «условиям запроса»

mx-3 перезапишет смещение, поэтому вы не сможете использовать их оба