Buongiorno a tutti,
avrei bisogno d'aiuto

All'interno di una pagina che sto disperatamente cercando di rendere responsive, dove prima avevo una bella tabella centrata, con 2 celle affiancate ognuna contenente testo allineato a sinistra,
ora sto cercando di ottenere lo stesso risultato visivo con css e div su desktop, ma che sia responsive su piccoli schermi.

Cerco di spiegarmi meglio:
ho creato un div contenitore, all'interno ho messo altri 2 div affiancati contenenti il testo:
ebbene i 2 div si sovrappongono su piccoli schermi e va bene, su desktop sono giustamente affiancati ma tutti sulla sinistra della pagina, io li vorrei centrati i div, ma il testo al loro interno allineato a sinistra

Ecco il codice
codice HTML:
    <div class="contenitore" style="display: inline-block; margin: 0 auto;font-family: Times new roman; font-size: 17px; color: #000080; width: 100%; height: auto">
<div style="display: inline-block; margin: 0 auto; padding-left: 5px; max-width: 100%; vertical-align: top;">
<B><U>Vixin a-o Bambin</U><br>
Chì davanti a-o Presepio, c&auml;o Bambin,<br>mì me ghe incanto<br>pròprio cômme in ninnin...</B>
</div>
<div style="display: inline-block; margin: 0 auto; padding-left: 5px; max-width: 100%; vertical-align: top;">
<U>Vicino al Bambino</U><br>
Qui davanti al Presepe, caro Bambino,<br>io mi ci incanto<br>proprio come un bambino...
</div>
    </div>
Grazie a chi può aiutarmi