Ещё можно без задавания ширины блока, выровнять (текст остается по левому краю) вот так
<div class="main">
<div class="block">текст</div>
<div class="block">текст</div>
<div class="block">текст</div>
</div>
.main {
width:100%;
display:flex;
}
.block {
-webkit-flex: 1;
flex: 1;
}
в этом варианте ширина блоков будет вычисляться автоматом в зависимости от ширины main. Сползать друг под друга не будут, эту задачу без (media) никак не решить.