Czytelny tekst na całą szerokość ekranu na telefonach

Potrzebuję prostej strony w htmlu (+css). Ustawiłem szerokość diva z tekstem na 500px, wyśrodkowanie w poziomie i na komputerze jest tak jak chciałem, wszystko widać. A na telefonie o ekranie szerokim na 4 cm tekst wyświetla się na jakieś 2 cm w środku, a litery mają wielkość kilku kropek. Jak zrobić, żeby na telefonie tekst wyświetlał się w czytelnym rozmiarze bez potrzeby powiększania, domyślnie na całą szerokość, bez suwaka poziomego, ale z pionowym w razie długiego tekstu. Wiem jak dodać oddzielny styl dla urządzeń mobilnych, ale nie mam pojęcia jak to ostylować.

co do mniejszej szerokosci diva to trzeba looknac w kod, a co do tekstu to wielkosc tekstu ustalaj za pomoca em a nie px,

wtedy wielkosc tekstu bazowa w css "body" ustawiasz na np. 16px.

a cala reszte wielkosci ustalasz opierajac sie na wartosci bazowej patrzac tu: http://pxtoem.com/

wiec wielkosc czcionki pragarafu jesli chcesz na 16 px tak samo to ustawiasz mu 1em, jesli wiekszy to np. 1.125em i wtedy w media queries zmieniasz wielkosc tekstu bazowego z 16px na 20px, a wielkosc wszystkich innych tekstow sie przeskalowuje automatycznie.

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">