[![This is the result I see when accessing my page on a mobile device
<head>
<title>Login Page</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
</head>
//body part
<?php $this->load->view('navigation'); ?>
<div id='display'>
<div class="col-sm-6" id='display_show'>
<img src="<?php echo base_url(); ?>images/c2b.jpg" class="img-thumbnail" alt="Cinque Terre" width="340" height="300">
<img src="<?php echo base_url(); ?>images/c2s.jpg" class="img-thumbnail" alt="Cinque Terre" width="340" height="300">
</div>
</div>
<div class="row" id="view">
<div class="col-sm-6">
<button type="button" id='btn_overlay' class="btn btn-warning btn_view"><font size='4px'>C1</font><br />kariakoo</button>
<button type="button" class="btn btn-warning btn_view"><font size='4px'>C2</font><br />kariakoo</button>
</div>
</div>][1]][1]
https://i.sstatic.net/mdMM1.png
I am having trouble viewing my content on a smartphone