Это корректное решение?

Question

[SideWest]

Текст и кнопка продолжающая этот текст, хочу сделать адекватное отображение на разных устройствах

Выглядит так, как я задумывал, но правильный ли это подход, как правильно делать?

<span id="startT">Be ready and</span>
    <button onclick="startTrip()" id="startB">press</button>

#startT{
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    color: white;
    font-size: 24px;
    left: 50%;
    top: 50%;
    margin-left: -235px;
    margin-top: -15px;
    position: fixed;     

}

@media only screen and (max-width: 600px) {
    #startT{
        left: 92%;
        top: 45%;
    }
  }

button{
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    text-align: left;
    font-size: 20px;
    height: 30px;
    width: 200px;
    left: 50%;
    top: 50%;
    margin-top: -15px;   /* = -height / 2   */
    margin-left: -100px; /* = -width / 2    */
    position: fixed;     
}

@media only screen and (max-width: 600px) {
    button{
        text-align: center;
        width: 180px;

    }
  }

Answer 1

[Александр]

Читайте про flex'ы