how do i center three images [Archive]

View Full Version : how do i center three images

Chimpie

02-15-2009, 03:31 AM

I'm creating a module in vBa where three logos are going to placed. I want the three images to be spaced evenly from each other and the sides so that it looks like *space - logo- space - logo - space - logo - space* So far I have the following but I don't know what's missing.

<table align="center" border="0"><tr><td><div align="center"><img src="/files/bizlogos/arnoldpalmer.jpg" alt="alt" title="alt" /></div></td><td><div align="center"><img src="/files/bizlogos/ritas.jpg" alt="alt" title="alt" /></div></td><td><div align="center"><img src="/files/bizlogos/pologrill.jpg" alt="alt" title="alt" /></div></td></tr></table>

Vaupell

02-15-2009, 08:22 AM

i would first make a CSS class and like this

.spacer {
padding-right: 25px;
padding-left: 25px;
}

Then in the table i would make the table like this

<table align="center"><tr>
<td class="spacer"><img src="/1color[1].jpg" alt="" width="200" height="200" /></td>
<td class="spacer"><img src="/1color[1].jpg" alt="" width="200" height="200" /></td>
<td class="spacer"><img src="/1color[1].jpg" alt="" width="200" height="200" /></td>
</tr></table>

padding ajusted to how much space i need ofcourse.

Chimpie

02-15-2009, 12:24 PM

I've never messed with CSS classes before. Where specifically would I enter that?

vbplusme

02-15-2009, 12:34 PM

You can lose the table and do it too!

goes in Main CSS in the Additional CSS at the bottom of the page:

.spacer {
padding-right: 25px;
padding-left: 25px;
}

Place where you want images to display:

<div align="center">
<span class="spacer"><img src="/1color[1].jpg" alt="" width="200" height="200" /></span>
<span class="spacer"><img src="/1color[1].jpg" alt="" width="200" height="200" /></span>
<span class="spacer"><img src="/1color[1].jpg" alt="" width="200" height="200" /></span>
</div>

Vaupell

02-15-2009, 12:44 PM

I've never messed with CSS classes before. Where specifically would I enter that?

is it on a html page you can do this between

</head>
<style>
.spacer {
padding-right: 25px;
padding-left: 25px;
}
</style>
<body>

But then its ONLY on that page,
if its on vbulletin powered page, you can in your admincp goto styles and templates
click Go on your style, and way at the botton is a box named

Additional css.
where you just enter

.spacer {
padding-right: 25px;
padding-left: 25px;
}

and save, then its availible on all vb pages. Might want to change the name
.space is common might be dublicated with a mod or something other.. :D

Chimpie

02-15-2009, 12:55 PM

Thanks, I'll give it a try in a little bit.

--------------- Added 1234722670 at 1234722670 ---------------

Worked perfectly. Thanks.