4 replies [Last post]
no1jimmyman
no1jimmyman's picture
Offline
newbie
Last seen: 11 years 21 weeks ago
Timezone: GMT+11
Joined: 2010-12-13
Posts: 7
Points: 10

Hello,

My problem is i have a basic table that contains 1 table row with 1 table data cell that is 500px x 400px in size. I have an image i wish to place into the data cell that is 300px x 300px however i want the image to be right in the centre of the table data cell. So effectively i want to be able to centre text/images etc in the centre of the cell (center left to right; centre top to bottom)

Please help me!!

Thanks,

Jimmy

Ed Seedhouse
Ed Seedhouse's picture
Offline
Guru
Victoria British Columbia
Last seen: 1 year 13 weeks ago
Victoria British Columbia
Timezone: GMT-8
Joined: 2005-12-14
Posts: 3570
Points: 675

no1jimmyman wrote: My problem

no1jimmyman wrote:

My problem is i have a basic table that contains 1 table row with 1 table data cell that is 500px x 400px in size. I have an image i wish to place into the data cell that is 300px x 300px however i want the image to be right in the centre of the table data cell. So effectively i want to be able to centre text/images etc in the centre of the cell (center left to right; centre top to bottom)

Don't use a table, use proper semantic markup. What you are describing is not tabular content and doesn't belong in a table.

Ed Seedhouse

Posting Guidelines

Watch out! I am carrying irony, sarcasm and satire, and know how to use them.

makr
makr's picture
Offline
newbie
Stockholm, Sweden
Last seen: 11 years 21 weeks ago
Stockholm, Sweden
Timezone: GMT+1
Joined: 2010-12-20
Posts: 10
Points: 10

Vertical centering can be

Vertical centering can be realy tricky but if you know width & height like in your case it is very easy.

I would do it like this, but there is moreways to solve this issue

<div style="width: 500px; height: 350px; text-align: center; padding-top: 50px">
	<img src="IMAGE_URL" alt="IMG" style="width: 300px; height: 300px;" />
</div>

also if you want the div itself centered just add

margin: 0 auto;
to the div and it will center itself in the parent container (it needs to have a width set)

no1jimmyman
no1jimmyman's picture
Offline
newbie
Last seen: 11 years 21 weeks ago
Timezone: GMT+11
Joined: 2010-12-13
Posts: 7
Points: 10

Ok for the sake of this

Ok for the sake of this exercise, i am wanting to know how to center the contents of the TD tag; by centering i mean top/bottom and left/right. i need text to grow from the center of the TD tag.

no1jimmyman
no1jimmyman's picture
Offline
newbie
Last seen: 11 years 21 weeks ago
Timezone: GMT+11
Joined: 2010-12-13
Posts: 7
Points: 10

sorry i posted a reply to the

sorry i posted a reply to the first response before you had posted yours...i will try it and let you know...thanks