Jiung Song
Jiung Song

Reputation: 72

Twitter Bootstrap on Mobile

So I have a website that is built on bootstrap (Navigation + Body Container) so everything should be responsive.

I have everything in rows and columns (col-lg-12).

So my question here is this. I have my body container column size as (LG - Large (incase anyone gets confused with the phone's))

When I access this website from my computer and I resize the screen, it works as expected, pretty good. (Since I followed a tutorial)

But when I access the website from my mobile phone, the website looks like what I would see on a full screen PC screen.

I looked online and an article said to use two classes for the DIV's inside the ROWs. So this is what I did.

<div class="col-lg-12 col-xs-12">Content!</div>

This also doesn't work. How would I go on to making my bootstrap more mobile compatible as it does when I resize my browser?

Do I have to make the website redirect to a mobile version when accessed on mobile like most websites? Or do I have to include a certain meta tag in my head?

Upvotes: 1

Views: 71

Answers (1)

Will
Will

Reputation: 20235

My best guess is that you don't have the viewport meta tag in your <head> which tells the browser to use the device's width as the html document's width. See the basic template docs.

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
  ...

Upvotes: 3

Related Questions