Re: Vertical align of image in a div tag



In article
<1194991670.527924.282660@xxxxxxxxxxxxxxxxxxxxxxxxxxxx>,
"dalyea@xxxxxxxxx" <dalyea@xxxxxxxxx> wrote:

I have the following code which is supposed to show, in 4 columns, the
price,
web site, image + product name, and date. The 3rd column uses div
tags so
that I can align things correctly. The li1 tag is supposed to align
the image inside
it vertically inside a 64x64 px container. When an image is less than
64px in
height, though, it aligns to the top of container. I figured out how
to use the p
tag in li2 to vertically align the text, but this technique doesn't
work for the image
in li1.

Anyone know how to align the image vertically in the middle of the div
container?

Thanks! Code as follows:


<table class=tbl00>
<tr>
<td class=mt>$5.95</td>
<td class=lt>Bike Shop</td>
<td class=lt>
<div class=li1><a href="xxx"><img src="http://www.aebike.com/images/
library/catalogs/soc/p350X350m/HT3200.jpg" width=64 height=18 border=1

I snip rest and styles...



I suggest you get rid of *all* your styles (there are many faults
with it), all your classes bar one, all your divs, all your <p>s.
Why would you not prefer something so much simpler along the
lines of:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd";>
<html>
<head>
<title>...</title>
<style type="text/css">
table{border-collapse: collapse;}
td {border:2px solid #000; padding: .4em;}
..picItemCell {text-align: center;}
</style>
</head>
<body>
<table cellspacing="0" summary="bike items and prices etc...">
<tr>
<td>$5.95</td>
<td>Bike Shop</td>
<td class="picItemCell">
<a href="xxx"><img
src="http://www.aebike.com/images/library/catalogs/soc/p350X350m/H
T3200.jpg" width="64" height="18" alt=""></a><a
href="xxx"><br>Ritchey True grip
black (HT3200)</a></td>
<td>11/12/07</td></tr>
</table>
</body>
</html>

?

--
dorayme
.



Relevant Pages

  • Re: display:inline block elements
    ... CES wrote: ... Within the row their is a <Div> that I want to align to the Right hand side of the <Div ... Align is not a valid attribute of the Div element... ...
    (comp.infosystems.www.authoring.stylesheets)
  • Re: display:inline block elements
    ... I was hoping that someone might be able to help me with a few questions on Aligning Block Elements properly... ... Within the row their is a <Div> that I want to align to the Right hand side of the <Div ... Align is not a valid attribute of the Div element... ...
    (comp.infosystems.www.authoring.stylesheets)
  • Re: display:inline block elements
    ... On 2006-07-09, CES wrote: ... their is a <Div> that I want to align to the Right hand side of the <Div ... Align is not a valid attribute of the Div element... ...
    (comp.infosystems.www.authoring.stylesheets)
  • RE: images and text not aligning
    ... you are confusing how the align works with containers and elements. ... div an align defines how its content is aligned. ... it specifies how its aligned within the text flow (baseline). ...
    (microsoft.public.dotnet.framework.aspnet)
  • Re: how to make a div with a pic...
    ... you can use the "align" attribute of the img tag to position the image ... use the float inline style on the img tag to position the image to the ...
    (alt.html)