Блочня модель документа 8/23

Никак не могу понять… изначально блоки занимают всю ширину страницы. Когда мы задаем фиксированную ширину блока, то размер текста «Блок 1» внутри блока уменьшается. Почему?

Код покажите.

html,

body {
margin: 0;
padding: 0;
}

body {
width: 540px;
min-height: 290px;
padding-top: 20px;
padding-left: 20px;

font-size: 14px;
line-height: 1.5;
font-family: “Arial”, sans-serif;
color: white;

background-color: #3a78a1;
background-image: url(“grid.png”);
background-repeat: repeat;
background-position: -80px -80px;
}

.block {
background-color: rgba(0, 255, 255, 0.2);
border: 2px solid white;
}

.block1 {
width: 200px;
padding-bottom: 15px;
}

Я задал только значения для block1 (самое нижнее правило). НО! изначально я это делал с телефона, скрин оттуда же. На компе все нормально, размер шрифта не меняется.

И все же интересно, почему так на телефоне)