Databases
StackOverflow2013
Postsdbo
POalign button items on top of a table with twitter bootstrap
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POalign button items on top of a table with twitter bootstrap
    text
    copied!<p>I am trying to align some button and a input box with a table. Previous day and next day may or may not be present on the page depending on if a day exists. Below is by start code, current output and desired output. </p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;link href="bootstrap/css/bootstrap.css" rel="stylesheet"&gt; &lt;/head&gt; &lt;body&gt; &lt;div class="container"&gt; &lt;form class = "form-inline" &gt; &lt;h1&gt;some data&lt;/h1&gt; &lt;br&gt; &lt;button class="btn" name = "prevDayBtn"&gt;&lt;i class="icon-backward"&gt;&lt;/i&gt; Previous Day&lt;/button&gt; &lt;input type='text' READONLY name = 'pageDate' value = '2013-05-18' /&gt; &lt;button class="btn" name = "nextDayBtn" &gt;Next Day &lt;i class="icon-forward"&gt;&lt;/i&gt;&lt;/button&gt; &lt;br&gt; &lt;br&gt; &lt;table class = "table table-striped"&gt; &lt;th&gt;col1&lt;/th&gt;&lt;th&gt;col2&lt;/th&gt;&lt;th&gt;col3&lt;/th&gt;&lt;th&gt;col4&lt;/th&gt;&lt;th&gt;col5&lt;/th&gt;&lt;th&gt;col6&lt;/th&gt;&lt;th&gt;col7&lt;/th&gt;&lt;th&gt;col8&lt;/th&gt; &lt;/table&gt; &lt;/form&gt; &lt;/div&gt; &lt;!-- /container --&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p><strong>Current Output</strong></p> <p><img src="https://i.stack.imgur.com/VWwNC.png" alt="enter image description here"></p> <p><strong>Desired Output</strong></p> <p><img src="https://i.stack.imgur.com/lQDzX.png" alt="enter image description here"></p> <p><strong>Edit:</strong> </p> <p>I tried Accipheran answer and got the result below. Also added code to jsFiddle <a href="http://jsfiddle.net/Y9SLs/1/" rel="nofollow noreferrer">http://jsfiddle.net/Y9SLs/1/</a></p> <p><img src="https://i.stack.imgur.com/3n21Q.png" alt="enter image description here"></p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

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