CODEWITHSUNDEEP
htmlcss
ben_dchost
ben_dchost

Reputation: 915

How do I add a button in <table> below all content?

I need to add a 'order now' button at the bottom of my table. After doing some research I have been unable to find a solution to my problem (which I'm sure I'm just missing a simple trick)

Here is my table:

<table class='elegantaerobasket margin_bottom'>
<thead>
    <tr>
        <th class="baskettabletitle1 pricecomparison th1" colspan="4">Web Hosting</th>
    </tr>
    <tr>
        <th class="baskettabletitle1 basketleftmargin th1">Product</th>
        <th id="averagepadding2" class="baskettabletitle1 baskettb3hosting th1">2 Years</th>
    </tr>
</thead>
<tbody>
    <tr>
        <!-- Product -->
        <td class="basketrowspace basketleftmargin "><b>Unlimited Web Hosting</b>
        </td>
        <!-- 2 year cost -->
        <td class="basketrowspace baskettb33hosting">£12.00</td>
    </tr>
</tbody>
</table>

FIDDLE #I've added the button in a seperate DIV to show how it should dispaly

I've tried adding a button in the <tfooter> and with some a lot of tweaking I'm sure it could work but is there a better/simple way to do it?

Thanks

Upvotes: 0

Views: 1860

Answers (1)

wildandjam
wildandjam

Reputation: 502

I may be missing what you're asking for, but here's the button inside tfoot:

http://jsfiddle.net/wildandjam/q6qQF/1/

<tfoot>
    <tr>
        <td colspan="2">
            <div class="elegantaerobasket margin_top">
                <a href="#" class="button">Order Now</a>
            </div>
        </td>
    </tr>
</tfoot>

Upvotes: 2

Related Questions