The layout is centered and the screen fits

.xianshibuju_c{

    display: flex;

    height: 100%;

    align-items: center;

    // fixed width

    width: 400px;

    position: absolute;

    margin-left: 50%;

    transform: translateX(-45%);

  }

When the icon and the text are on the same line, you only want the text to be centered, and the icon is fixed to the left of the text.

<div class="tit">
    <div :class="dianjivalue == 4 ? 'tit-active' : ''" class="aaa">
        <div class="imagetit bbb" v-if="dianjivalue == 4"></div>
        <div class="imagetit1 bbb" v-else></div>
        杂费 
    </div>
</div>

<style>
    .tit{
        display:flex;
        justify-content: center;
    }
    .aaa{
        position:relative;
    }
    .bbb{
        position:absolute;
        left:-15px;
    }

</style>