Murray,
Thanks for the question.
Was it you that sorted me out last time? If so, apologies. I thought
I had got it right. ;-(
I have these general styles
body {width: 800px ;
font: 16px Times New Roman,Arial,Helvetica,sans-serif
; background-color: #00FFCC ;
background-image:
url("images/display/04-08-24-1-bird-bath.jpg") ;
padding: 0 ; margin: 0 auto ;}
h1, h2, h3, h4, h5, h6, th
{text-align: center ;}
table {width: 100% ;}
td, th {vertical-align: top ;}
img {float: left ; border: 0 ; margin: 0; padding: 0 ;}
I have this body tag
<body id="pic" onload="chgImg(-100);">
This is the CSS for id "pic"
body#pic {width: 90% ;
background: white ;
font: 14px Verdana,Arial,Helvetica,sans-serif ;
text-align: center ;}
And this is the HTML
table>
<tr>
<td valign="top" align="center"><span id="Image">...</span></td>
</tr>
</table>
id "Image" is replaced by this code in chgImg (where ImgNum is
derived from the parameter passed to it)
document.getElementById('Image').innerHTML =
'<img src="' + Slides[ImgNum]
+ '" width="' + w + '" height="' + h
+ '" alt="">'
--
Cheers,
Trevor L.
Website:
http://tandcl.homemail.com.au
Murray wrote:
Are you floating these images, or do you have some unmentioned CSS
affecting them?
Thomas,
Thanks, I have done that (valign changed).
Horozontal images align perfectly. If I widen the window, the gap
on either side increases. But vertical pictures align to the same
left margin as horizontal pictures and part of the top is cut off.
Mystified :-?
--
Cheers,
Trevor L.
Website:
http://tandcl.homemail.com.au
Thomas A. Rowe wrote:
Tighten up your table, by making sure the </td> on the same line
as the end of your cell content, like so (you can remove the
valign="middle" if you don't want center vertically in the cell):
<table>
<tr>
<td valign="middle" align="center"><span
id="Image">...</span></td> </tr>
<tr>
<td valign="middle" align="center"><span
id="ImgText">..</span></td> </tr>
Yes, I am, by this code
<input type="button" value="Slideshow - Family"
onclick= "spawnJimcoPopup ('slideshow.html
.................;return false;"> In slideshow.html I have the
code <table>
<tr>
<td align="center">
<span id="Image">...</span>
</td>
</tr>
<tr>
<td>
<span id="ImgText">..</span>
</td>
</tr>
and then buttons such as
<input type="button"
value="Next >>"
onclick="chgImg(1)">
The function chgImg() receives the parameter and derives ImgNum
from it. It then has the code
var w, h
if (Pictures[ImgNum].substr(0,1) == 'H')
{ w="540"; h="360" }
else if (Pictures[ImgNum].substr(0,1) == 'V')
{ w="360"; h="540" }
else // square
{ w="440"; h="440" }
document.getElementById('Image').innerHTML =
'<img src="' + Slides[ImgNum]
+ '" width="' + w + '" height="' + h
+ '" alt="Image">'
document.getElementById('ImgText').innerHTML =
(ImgNum + 1) + '/' + Captions.length + ' ' + Captions[ImgNum]
Slides and Captions are arrays containing filenames and captions
--
Cheers,
Trevor L.
Website:
http://tandcl.homemail.com.au
Thomas A. Rowe wrote:
But aren't you loading a page into the window create by Spawn
with the image on the page?
Thomas,
Thanks for the reply.
I am not using FP directly for the particular page because it
is called via Spawn from another page.
However, after Murray's suggestion, I altered the <td> tag, so
I guess it is cell properties. --
Cheers,
Trevor L.
Website:
http://tandcl.homemail.com.au
Thomas A. Rowe wrote:
Have are you setting the alignment, on the image, the toolbar
alignment icon or the cell properties?
Suggest using the cell properties only.
I thought it might be something like this.
I added the align="center" to the <td> tag, and it moved the
image over a bit to the right. Actually what it does is
center horizontal pictures , but vertical pictures are
aligned left to the same left point as the horizontal
pictures (if that makes sense). That is, if the window is
600*600, a horizontal picture (540*360) is
vertically aligned to the top and horizontally aligned so
that there is 30 gap on either side. A vertical picture
(360*540) then is vertically aligned to the top and
horizontally aligned so that
there is 30 gap on the left side and 210 on the right side.
Do I need to add a <div> which is absolutely positioned, and
alter the positioning of the <div> depending on whether the
picture is vertical or horizontal. (This is part of a slide
show so there are over 100 pictures at the moment) --
Cheers,
Trevor L.
Website:
http://tandcl.homemail.com.au
Murray wrote:
Spans do not align like that.
Try this -
<table>
<tr>
<td align="center">
<span id="Image">
<img src="xxx.jpg" width="600" height="400" alt="Image">
</span>
</td>
</tr>
You don't need the float:none.
I resolved this many moons ago but now it has come back.
I made a few minor (I thought) changes to my HTML and my
images are no longer centred
This is the code:
<table>
<tr>
<td>
<span id="Image" align="center">
<img src="xxx.jpg" width="600" height="400" alt="Image"
float="none"> </span>
</td>
</tr>
.......
I tried align = "center" and float = "none" all to no
avail - the image will not centre :-8
--
Cheers,
Trevor L.
Website:
http://tandcl.homemail.com.au
I choose Polesoft Lockspam to fight spam, and you?
http://www.polesoft.com/refer.html
