Sam Kong
Sam Kong

Reputation: 5800

How to align button centered below table?

I put form elements in a table so that column names and inputs are aligned to 2-columns. And I put submit button and cancel button below the table. The table width is not fixed. I want to put the buttons center-aligned of the table width.

One simple way is to put the buttons in the table. But I want to separate them from the table. What's the most elegant way to do that?

Upvotes: 8

Views: 44271

Answers (2)

Steve
Steve

Reputation: 21

Since the buttons and table are related you could use a fieldset:

<fieldset>
<!-- Your table -->
<table />
<!-- Your buttons -->
<p style="text-align:center;">
<input />
</p>
</fieldset>

Upvotes: 2

Dimi Takis
Dimi Takis

Reputation: 4939

Structure like this:

<div>
<!-- Your table -->
<table />
<!-- Your buttons -->
<div style="text-align:center;">
<input />
</div>
</div>

Upvotes: 9

Related Questions