Относительная ширина изображения в мобильных браузерах ⇐ CSS

[Anonymous]

посмотрев на этот пример веб-страницы (см. код ниже), я обнаружил, что в моих мобильных браузерах (Firefox и Chrome) изображение в левой части страницы отображается с нулевой шириной, тогда как в тех же браузерах на моем ноутбуке оно имеет правильную ширину.
код веб-страницы правильно проверяется w3 для html и css.
единственный способ просмотреть изображение в мобильных браузерах, по-видимому, использует фиксированную ширину изображения, вместо относительных, но мне это решение не нравится.
Кто-нибудь может помочь мне догадаться о чем-нибудь, объясняющем такое поведение?
вот html-код:




TITLE




TEXT





TEXT
TEXT
TEXT


TEXT
TEXT
TEXT


TEXT







а вот CSS:
body {margin:1em auto;width:90%;background-color: #ebf1dd} div {padding: 6px}
.fasciaSx {
text-align:justify;
}
.primaRiga .colonna {
margin: 0 2em;
}
.riga .colonna {
margin: 0 2em;
}
.contenitore {display:flex; text-align:center;}
.fasciaSx {flex: 15%}
.fasciaDx {flex: 85%}
.primaRiga {display:flex; text-align:center;
flex-direction: row;
}
.riga {display:flex; text-align:justify;
flex-direction: row;
}
.colonna {flex: 33%;}
.dx, .sx {background-color: #f2e7a0}
.cx {background-color: #e4f6a4}


Подробнее здесь: https://stackoverflow.com/questions/798 ... e-browsers