Databases
StackOverflow2013
Postsdbo
PONot working responsive?
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PONot working responsive?
    primarykey
    data
    text
    <p>I am trying to make my table responsive but its not happening. I don't know where is the problem. I am using bootstrap-responsive.css to make it happen, but the table is not breaking like other pages break when I open in mobile.</p> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"&gt; &lt;title&gt;Untitled Document&lt;/title&gt; &lt;link href="css/bootstrap.css" rel="stylesheet"/&gt; &lt;link type="text/css" href="css/bootstrap-responsive.css" rel="stylesheet" /&gt; &lt;script src="test/bootstrap.js"&gt;&lt;/script&gt; &lt;script src="js/jquery.js"&gt;&lt;/script&gt; &lt;script src="js/bootstrap-transition.js"&gt;&lt;/script&gt; &lt;script src="js/bootstrap-modal.js"&gt;&lt;/script&gt; &lt;script src="js/bootstrap-dropdown.js"&gt;&lt;/script&gt; &lt;link href="css/bootstrap-combined.css" rel="stylesheet"&gt; &lt;link type="text/css" href="js/template.css" rel="stylesheet" /&gt; &lt;link href="test/flip-scroll.css" rel="stylesheet"&gt; &lt;style&gt; #tbl{ border: thin solid #eee; } #tbl td{ padding:5px; border-bottom: thin solid #C4C4C4; border-right:thin solid #eee; } #tbl tr:last-child td{ border-bottom:none; } #tbl td:last-child{ border-right:none; } #tbl tr:nth-child(odd){ background-color:#dafaf6; } .heading{ color:#FFFFFF; font-size:14px; padding:10px; text-align:center; } .clear { height:70px; } .current a { color:#FFF; } .divDemoBody { width: 60%; margin-left: auto; margin-right: auto; margin-top: 100px; } .divDemoBody p { font-size: 18px; line-height: 140%; padding-top: 12px; } .divDialogElements input { font-size: 18px; padding: 3px; height: 32px; width: 500px; } .divButton { padding-top: 12px; } &lt;/style&gt; &lt;/head&gt; &lt;body&gt; &lt;div style="width:100%; background-color:#1d719a; height:100px;"&gt; &lt;img src="nature/logo.png" style="margin:23px 0px 0px 30px;"&gt; &lt;div style="width:30%; float:right; text-align:right; margin-right:20px; margin-top:20px;"&gt; &lt;a href="clinic_dash_board.html" title="Home"&gt;&lt;img src="images/home_icon.png" height="32" width="32"/&gt;&lt;/a&gt; &lt;a href="cliniclog.html" title="Logout"&gt;&lt;img src="images/logout.png" height="32" width="32" /&gt;&lt;/a&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="row" style="margin-left:50px; margin-top:50px"&gt; &lt;div class="span12" align="center"&gt; &lt;form method="get" action="/" class="form-inline" &gt; &lt;input name="q" class="span5" type="text" placeholder="Keywords:Name" &gt; &lt;button type="submit" class="btn btn-small btn-primary"&gt;Search&lt;i class="icon-search icon-white"&gt;&lt;/i&gt;&lt;/button&gt; &lt;/form&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="container" style="margin-top:60px;"&gt; &lt;div class="row-fluid"&gt; &lt;div class="span12"&gt; &lt;legend style="font-family:Georgia, 'Times New Roman', Times, serif; font-style:italic; color:#06C;"&gt;Patient Details&lt;/legend&gt; &lt;table align="right" style="margin-right:50px"&gt;&lt;tr&gt;&lt;td&gt;&lt;div class="pagination"&gt;&lt;ul&gt;&lt;li class="active"&gt;&lt;a&gt;1&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=""&gt;2&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=""&gt;3&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=""&gt;&amp;raquo;&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt; &lt;/table&gt; &lt;table cellpadding="0px" cellspacing="0px" border="0" style="width:90%" align="center"&gt; &lt;tr&gt; &lt;td&gt; &lt;section id="flip-scroll" style="margin-left:40px; width:100%"&gt; &lt;table class="table-bordered table-striped table-condensed cf" style="width:95%; "&gt; &lt;thead style="background-color:#045c97;"&gt; &lt;tr&gt; &lt;th class="heading"&gt;Patient Name&lt;/th&gt; &lt;th class="heading"&gt;Date OF Birth&lt;/th&gt; &lt;th class="heading" &gt;Subject&lt;/th&gt; &lt;th class="heading"&gt;Progress Note Date&lt;/th&gt; &lt;th class="heading"&gt;Provider&lt;/th&gt; &lt;th class="heading"&gt;Action&lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;tbody style="font-size:12px;"&gt; &lt;tr&gt; &lt;td&gt;&lt;a href="clinic_edit.html"&gt;Shiv Acharya&lt;/a&gt;&lt;/td&gt; &lt;td&gt;06-03-1991&lt;/td&gt; &lt;td&gt;Suffering From high Fever&lt;/td&gt; &lt;td&gt;12-04-2013&lt;/td&gt; &lt;td&gt;SA&lt;/td&gt; &lt;td&gt; &lt;div class="dropdown btn-group"&gt; &lt;a class="btn dropdown-toggle" data-toggle="dropdown" href="#"&gt; Actions &lt;span class="caret"&gt;&lt;/span&gt; &lt;/a&gt; &lt;ul class="dropdown-menu"&gt; &lt;li&gt;&lt;a href="clinic_edit.html"&gt;Edit Demographics&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="clinic_demo.html"&gt;New Encounter&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="clinic_history.html"&gt;View Past Notes&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;&lt;a href="clinic_edit.html"&gt;Biswajeet Mahapatra&lt;/a&gt;&lt;/td&gt; &lt;td&gt;09-08-1991&lt;/td&gt; &lt;td&gt;Suffering From back pain&lt;/td&gt; &lt;td&gt;12-04-2013&lt;/td&gt; &lt;td&gt;BM&lt;/td&gt; &lt;td&gt; &lt;div class="dropdown btn-group"&gt; &lt;a class="btn dropdown-toggle" data-toggle="dropdown" href="#"&gt; Actions &lt;span class="caret"&gt;&lt;/span&gt; &lt;/a&gt; &lt;ul class="dropdown-menu"&gt; &lt;li&gt;&lt;a href="clinic_edit.html"&gt;Edit Demographics&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="clinic_demo.html"&gt;New Encounter&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="medical_history.html"&gt;View Past Notes&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;&lt;a href="clinic_edit.html"&gt;Praveen jena&lt;/a&gt;&lt;/td&gt; &lt;td&gt;06-03-1991&lt;/td&gt; &lt;td&gt;Suffering From heart attack&lt;/td&gt; &lt;td&gt;12-04-2013&lt;/td&gt; &lt;td&gt;SJ&lt;/td&gt; &lt;td&gt; &lt;div class="dropdown btn-group"&gt; &lt;a class="btn dropdown-toggle" data-toggle="dropdown" href="#"&gt; Actions &lt;span class="caret"&gt;&lt;/span&gt; &lt;/a&gt; &lt;ul class="dropdown-menu"&gt; &lt;li&gt;&lt;a href="clinic_edit.html"&gt;Edit Demographics&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="clinic_demo.html"&gt;New Encounter&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="medical_history.html"&gt;View Past Notes&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;&lt;a href="clinic_edit.html"&gt;Sahil Sahoo&lt;/a&gt;&lt;/td&gt; &lt;td&gt;06-03-1991&lt;/td&gt; &lt;td&gt;Suffering From heart attack&lt;/td&gt; &lt;td&gt;12-04-2013&lt;/td&gt; &lt;td&gt;SJ&lt;/td&gt; &lt;td&gt;&lt;div class="btn-group"&gt; &lt;div class="dropdown btn-group"&gt; &lt;a class="btn dropdown-toggle" data-toggle="dropdown" href="#"&gt; Actions &lt;span class="caret"&gt;&lt;/span&gt; &lt;/a&gt; &lt;ul class="dropdown-menu"&gt; &lt;li&gt;&lt;a href="clinic_edit.html"&gt;Edit Demographics&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="clinic_demo.html"&gt;New Encounter&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="medical_history.html"&gt;View Past Notes&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;&lt;a href="clinic_edit.html"&gt;Akash Pattnaik&lt;/a&gt;&lt;/td&gt; &lt;td&gt;06-03-1991&lt;/td&gt; &lt;td&gt;Suffering From heart attack&lt;/td&gt; &lt;td&gt;12-04-2013&lt;/td&gt; &lt;td&gt;SJ&lt;/td&gt; &lt;td&gt;&lt;div class="btn-group"&gt; &lt;div class="dropdown btn-group"&gt; &lt;a class="btn dropdown-toggle" data-toggle="dropdown" href="#"&gt; Actions &lt;span class="caret"&gt;&lt;/span&gt; &lt;/a&gt; &lt;ul class="dropdown-menu"&gt; &lt;li&gt;&lt;a href="clinic_edit.html"&gt;Edit Demographics&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="clinic_demo.html"&gt;New Encounter&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="medical_history.html"&gt;View Past Notes&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;&lt;a href="clinic_edit.html"&gt;Sheetam kumar jena&lt;/a&gt;&lt;/td&gt; &lt;td&gt;06-03-1991&lt;/td&gt; &lt;td&gt;Suffering From heart attack&lt;/td&gt; &lt;td&gt;12-04-2013&lt;/td&gt; &lt;td&gt;SJ&lt;/td&gt; &lt;td&gt; &lt;div class="dropdown btn-group"&gt; &lt;a class="btn dropdown-toggle" data-toggle="dropdown" href="#"&gt; Actions &lt;span class="caret"&gt;&lt;/span&gt; &lt;/a&gt; &lt;ul class="dropdown-menu"&gt; &lt;li&gt;&lt;a href="clinic_edit.html"&gt;Edit Demographics&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="clinic_demo.html"&gt;New Encounter&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="medical_history.html"&gt;View Past Notes&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;div class="clear"&gt;&amp;nbsp;&lt;/div&gt; &lt;/section&gt; &lt;!-- &lt;table cellspacing="0" cellpadding="2" border="0" id="tbl" style="width:100%"&gt; &lt;tr style="background-color:#045c97"&gt; &lt;td class="heading"&gt;Patient Name&lt;/td&gt; &lt;td class="heading"&gt;Date OF Birth&lt;/td&gt; &lt;td class="heading"&gt;Subject&lt;/td&gt; &lt;td class="heading"&gt;Progress Note Date&lt;/td&gt; &lt;td class="heading"&gt;Provider&lt;/td&gt; &lt;td class="heading"&gt;Action&lt;/td&gt; &lt;/tr&gt; &lt;tr style="text-align:center;"&gt; &lt;td&gt;Shiv Acharya&lt;/td&gt; &lt;td&gt;06-03-1991&lt;/td&gt; &lt;td&gt;Suffering From high Fever&lt;/td&gt; &lt;td&gt;12-04-2013&lt;/td&gt; &lt;td&gt;SA&lt;/td&gt; &lt;td&gt; &lt;div class="dropdown btn-group"&gt; &lt;a class="btn dropdown-toggle" data-toggle="dropdown" href="#"&gt; Actions &lt;span class="caret"&gt;&lt;/span&gt; &lt;/a&gt; &lt;ul class="dropdown-menu"&gt; &lt;li&gt;&lt;a href="#"&gt;Edit Demographics&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;New Encounter&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;View Pastvotes&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr style="text-align:center;"&gt; &lt;td&gt;Biswajeet Mahapatra&lt;/td&gt; &lt;td&gt;09-08-1991&lt;/td&gt; &lt;td&gt;Suffering From back pain&lt;/td&gt; &lt;td&gt;12-04-2013&lt;/td&gt; &lt;td&gt;BM&lt;/td&gt; &lt;td&gt;&lt;div class="dropdown btn-group"&gt; &lt;a class="btn dropdown-toggle" data-toggle="dropdown" href="#"&gt; Actions &lt;span class="caret"&gt;&lt;/span&gt; &lt;/a&gt; &lt;ul class="dropdown-menu"&gt; &lt;li&gt;&lt;a href="#"&gt;Edit Demographics&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;New Encounter&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;View Pastvotes&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr style="text-align:center;"&gt; &lt;td&gt;Praveen jena&lt;/td&gt; &lt;td&gt;06-03-1991&lt;/td&gt; &lt;td&gt;Suffering From heart attack&lt;/td&gt; &lt;td&gt;12-04-2013&lt;/td&gt; &lt;td&gt;SJ&lt;/td&gt; &lt;td&gt;&lt;div class="btn-group"&gt; &lt;button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"&gt; Actions &lt;span class="caret"&gt;&lt;/span&gt; &lt;/button&gt; &lt;ul class="dropdown-menu" role="menu"&gt; &lt;li&gt;&lt;a href="#"&gt;Action&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Edit Demographics&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;New Encounter&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;View Pastvotes&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr style="text-align:center;"&gt; &lt;td&gt;Sahil Sahoo&lt;/td&gt; &lt;td&gt;06-03-1991&lt;/td&gt; &lt;td&gt;Suffering From heart attack&lt;/td&gt; &lt;td&gt;12-04-2013&lt;/td&gt; &lt;td&gt;SJ&lt;/td&gt; &lt;td&gt;&lt;div class="btn-group"&gt; &lt;button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"&gt; Actions &lt;span class="caret"&gt;&lt;/span&gt; &lt;/button&gt; &lt;ul class="dropdown-menu" role="menu"&gt; &lt;li&gt;&lt;a href="#"&gt;Action&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Edit Demographics&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;New Encounter&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;View Pastvotes&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr style="text-align:center;"&gt; &lt;td&gt;Akash Pattnaik&lt;/td&gt; &lt;td&gt;06-03-1991&lt;/td&gt; &lt;td&gt;Suffering From heart attack&lt;/td&gt; &lt;td&gt;12-04-2013&lt;/td&gt; &lt;td&gt;SJ&lt;/td&gt; &lt;td&gt;&lt;div class="btn-group"&gt; &lt;button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"&gt; Actions &lt;span class="caret"&gt;&lt;/span&gt; &lt;/button&gt; &lt;ul class="dropdown-menu" role="menu"&gt; &lt;li&gt;&lt;a href="#"&gt;Action&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Edit Demographics&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;New Encounter&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;View Pastvotes&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr style="text-align:center;"&gt; &lt;td&gt;Sheetam kumar jena&lt;/td&gt; &lt;td&gt;06-03-1991&lt;/td&gt; &lt;td&gt;Suffering From heart attack&lt;/td&gt; &lt;td&gt;12-04-2013&lt;/td&gt; &lt;td&gt;SJ&lt;/td&gt; &lt;td&gt;&lt;div class="btn-group"&gt; &lt;button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"&gt; Actions &lt;span class="caret"&gt;&lt;/span&gt; &lt;/button&gt; &lt;ul class="dropdown-menu" role="menu"&gt; &lt;li&gt;&lt;a href="#"&gt;Action&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Edit Demographics&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;New Encounter&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;View Pastvotes&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt;--&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;table align="right" border="0"&gt; &lt;TR align="right"&gt; &lt;TD&gt;&lt;form action="clinic_p.html"&gt; &lt;input type="submit" class="btn btn-success" value="Add Patient"&gt; &lt;/form&gt;&lt;/TD&gt;&lt;/TR&gt; &lt;/table&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div style="background-color:#1d719a; height:80px; margin-top:20px;"&gt; &lt;div style="width:40%; font:Verdana, Geneva, sans-serif; font-size:14px; font-weight:bold; color:#FFF;"&gt; &lt;table cellpadding="0" cellspacing="0" border="0" style="width:100%;"&gt; &lt;tr&gt;&lt;td style="height:20px;" colspan="2"&gt;&amp;nbsp;&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td style="width:5%"&gt;&amp;nbsp;&lt;/td&gt;&lt;td&gt;Copyrights 2013. All Rights Reserved.&lt;/td&gt;&lt;/tr&gt; &lt;/table&gt;&lt;/div&gt; &lt;div style="width:40%; float:right; text-align:right; margin:-40px 30px 0px 0px;font:Verdana, Geneva, sans-serif; font-size:14px; font-weight:bold; color:#FFF;"&gt; &lt;table cellpadding="0" cellspacing="0" border="0" style="width:100%;"&gt; &lt;tr&gt;&lt;td style="height:20px;" colspan="2"&gt;&amp;nbsp;&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td style="width:5%"&gt;&amp;nbsp;&lt;/td&gt;&lt;td&gt;Monyter Technologies Pvt. Ltd.&lt;/td&gt;&lt;/tr&gt; &lt;/table&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>Any solutions will be great.</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. This table or related slice is empty.
    1. USuser2775200
    plurals
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload