I have created a very simple page here: http://rasadata.gigfa.com/bootstrap/Home.html
When I open it in my pc browser everything is normal but when I open it in my LG G3 phone text size is very small that is impossible to read.
Why? I want to have a sensible text size on both devices.
What is wrong?
Here is the simple html:
<div class="container"> <div class="row"> <div class="col-md-4"> <p>A simple text</p> </div> <div class="col-md-4"> <p>A simple text</p> </div> <div class="col-md-4"> <p>A simple text</p> </div> </div> </div>
Text size on pc is normal but in mobile is very very small. How can I have the same text size on both devices?
Do you have any custom
CSS on the site that could be causing this issue?
I have but it is empty.
You're missing this mobile-first meta tag:
<meta name="viewport" content="width=device-width, initial-scale=1">
If you inspect the html of your work, you'll see that in bootstrap css, font set into
font-size:10px;) even though your body font size is
Change it into 14px as well as your body font size. Otherwise, create new custom stylesheet to write it.
Take a look at screenshot of your page;