Register FAQ / Rules Forum Spy Search Today's Posts Mark Forums Read
Go Back   MacRumors Forums > Special Interests > Visual Media > Web Design and Development

Reply
 
Thread Tools Search this Thread Display Modes
Old Mar 8, 2009, 09:03 AM   #1
torndownunit
macrumors regular
 
Join Date: Jan 2009
vertically and horizontally centering an image in a table cell using CSS

Hey guys. This is one of those things that I never really thought much about till I started to use mainly CSS.

I have a table (containing tabular data of course) that has small images next to product descriptions. I am trying to center the images both vertically and horizontally in the cell. I can find info on how each should be set online, but I can't seem to combine them properly.

It's one of those situation where I read several methods online, but the advice people give me on here will likely be (a) more current, and (b) way easier to understand and apply.

Thanks

Last edited by torndownunit; Mar 8, 2009 at 09:12 AM.
torndownunit is offline   0 Reply With Quote
Old Mar 8, 2009, 07:52 PM   #2
angelwatt
Moderator emeritus
 
angelwatt's Avatar
 
Join Date: Aug 2005
Location: USA
I ran a simple case:
[HTML]<style type="text/css">
td {
width: 750px; height: 600px;
text-align: center;
border: 1px solid #000;
}
</style>
</head>
<body>
<table>
<tr>
<td><img src="image01.jpg" alt="image 1" width="640" height="480" /></td>
</tr>
</table>[/HTML]
and the image was centered vertically and horizontally. The td seems to default to a vertical alignment of middle in most browsers. Also, img are display: inline by default. If the img is block instead then you'll need to add,
Code:
td img {
 display: block;
 margin: 0 auto;
}
to get the img to center horizontally. At least that's what I was seeing in my limited testing. The techniques for centering in tables haven't changed in a good while so whatever you've come across is likely still the common methods.
angelwatt is offline   0 Reply With Quote

Reply
MacRumors Forums > Special Interests > Visual Media > Web Design and Development

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump

Similar Threads
thread Thread Starter Forum Replies Last Post
center an iframe with css? Starhorsepax Web Design and Development 11 Feb 25, 2014 04:09 PM
Looking for a Vertical and Horizontal Mounting Dock Badfoot iPhone Accessories 3 Dec 4, 2009 03:21 PM
is it possible to always center my image in the screen if I add to the view and use ulquiorra iPhone/iPad Programming 8 Sep 9, 2009 11:14 AM
Looking for help centering an image in safari jaypm101 Mac Basics and Help 0 Dec 3, 2008 12:28 PM
centering an image in the scrollview cmezak iPhone/iPad Programming 1 Aug 15, 2008 01:11 PM


All times are GMT -5. The time now is 12:52 PM.

Mac Rumors | Mac | iPhone | iPhone Game Reviews | iPhone Apps

Mobile Version | Fixed | Fluid | Fluid HD
Copyright 2002-2013, MacRumors.com, LLC