Centre align table in div

This is probably basic but how do I get a table that is inserted in a div to centre align.

On this page http://www.curecancerscotland.org/ you will see there is a table with the E-buy form and E-quantity actions applied.

No matter what I try I cannot get this table to sit centre aligned. At the moment the left hand cell is much bigger than the right to push the text and drop down into the middle of the page but as a result the ‘Buy Now’ button stays at the far left - the beginning of the table.

At the moment the table is set width can grow but you will see when the broswer window is widened the Buy Now button gets left behind.

Any ideas?

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

If you have inserted this table as an inline object (clicked inside
the DIV until you saw a text cursor, then either pasted from the
clipboard or used Item > Insert to create it there) then it’s as easy
as setting the margin to Auto. Select the inline table with a single-
click, then look in the left-most tab of the Inspector. Margin is mid
way down the tab, and Auto is one of the preset options.

Walter

On Jul 4, 2008, at 8:38 PM, DeltaDave wrote:

This is probably basic but how do I get a table that is inserted in
a div to centre align.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks Walter that gets the table into the center - and if it was an ordinary table that would be OK.

Unfortunately the Buy Now button still thinks that the table starts at the left hand side of the div and so is disassociated from the text and quantity selector.

Anything else you can suggest. A hack to position the Buy Now at the middle of the table?

http://www.curecancerscotland.org/

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Dave,

I added a new row to the table and put the Buy Now button in it (it
was outside of the table). Then I targeted the button with this tag
style

input[type=‘submit’]

and set it to float: right. All of this can be seen in the source
code at http://anoptic.com/demo/delta_dave/center_button.html. If
you need to target the button more specifically you could attach an
id to it otherwise every submit button on the the site will float
right which may be an issue but you get the idea.

Todd

On Jul 5, 2008, at 5:46 PM, DeltaDave wrote:

Thanks Walter that gets the table into the center - and if it was
an ordinary table that would be OK.

Unfortunately the Buy Now button still thinks that the table starts
at the left hand side of the div and so is disassociated from the
text and quantity selector.

Anything else you can suggest. A hack to position the Buy Now at
the middle of the table?

http://www.curecancerscotland.org/


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Of course you could probably just put the button in a new table row then apply a class style to either the cell or button with a center alignment which should work just as well or you could split the cell. You have a few options.

Todd

On Jul 5, 2008, at 9:40 PM, Todd wrote:

I added a new row to the table and put the Buy Now button in it (it

was outside of the table). Then I targeted the button with this tag

style

input[type=‘submit’]

and set it to float: right.

Hi Todd

Thanks for this - this is a different approach to where I was going.

I am using the E Buy Form action applied to a table that contains the E Quantity selector. This then generates the Buy Now button automatically.

Because of this automatic generation I couldn’t target the button for positioning.

What you are suggesting - I think - is creating as Buy Now button, tied to the quantity selector and then because you physically have the button on the page you can target it to float (or whatever).

So I am probably being very dense here but how do I do that - assuming that I dont use the E Buy form action - or do I?

I can see how I could manually build the form using all the hash code info etc. but of course I am looking to get the actions to do all the hard work for me.

And as usual, on this list, efforts like this that go above and beyond the call of duty are always appreciated.

Thanks Todd

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I didn’t realize that it was action-generated, but still it’s not a problem. Leave everything as is (no extra table row etc.) but create this tag style:

input[value=‘Buy now’]
*This will target any button with a value of “Buy now” (exact spelling as the button - see code). Any other submit type buttons will be unaffected.

and in the Extended window give it the following name/value:

Name: margin-left:
Value: 300px (or whatever value you want)

This will shove it over as needed as seen here (different page from the first) <http://anoptic.com/demo/delta_dave/center_alt.html>

If you have more than one submit button on the site named “Buy now” then this will need some adjustment but try this just to see if it works for you then we can deal with the latter if necessary.

Todd

On Jul 6, 2008, at 4:44 AM, DeltaDave wrote:

I am using the E Buy Form action applied to a table that contains the E Quantity selector. This then generates the Buy Now button automatically.

Just to give you another option Dave, my previous suggestion is good
if you want to fine-tune the button position to somewhere other than
dead-center of the page. But if you do want to center it exactly then
just alter the style slightly like this:

input[value=‘Buy now’]

Name: display
Value: block

Click New and add another attribute:

Name: margin
Value: auto

This will throw it page-center.

Todd


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks Todd

I am off to try that now.

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Well Todd - that worked great.

Thanks very much for your efforts - its all in a good cause.

My mother-in-law set up this charity after my father-in law died from Myeloma, and she has been working hard ever since raising money for the Oncology Centre at the hospital where he died.

She always felt that they looked after him so well and deserves something back.

Just a PayPal donate button to do now.

Thanks again

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I’m glad it worked and for a good cause indeed. I hope you raise a lot of money.

Todd

On Jul 6, 2008, at 4:14 PM, DeltaDave wrote:

Thanks very much for your efforts - its all in a good cause.