How to get images completely fill a table cell?

L

liunx

Guest
<html><br />
<head><br />
<script language="JavaScript"><!--<br />
alt1 = new Image();<br />
alt1.src = <!-- m --><a class="postlink" href="http://www.htmlforums.com/archive/index.php/">http://www.htmlforums.com/archive/index.php/</a><!-- m -->"image1.jpg";<br />
<br />
alt2 = new Image();<br />
alt2.src = <!-- m --><a class="postlink" href="http://www.htmlforums.com/archive/index.php/">http://www.htmlforums.com/archive/index.php/</a><!-- m -->"image2.jpg";<br />
// --><br />
</script><br />
<br />
<script language="JavaScript"><!--<br />
function rewriteImg(id,imgName){<br />
d=document;<br />
re=d.all?d.all[id]:d.getElementById(id);<br />
re.innerHTML="<img src='http://www.htmlforums.com/archive/index.php/"+eval(imgName + ".src")+"'>";<br />
}<br />
// --><br />
</script><br />
</head><br />
<br />
<body><br />
<table name="bigtable" border="1" bordercolor="purple" width="100%" height="100%"><br />
<tr><br />
<td id="headmenu" colspan="2" height="9%"><br />
<a href=http://www.htmlforums.com/archive/index.php/"/" onmouseover="rewriteImg('imageframe','alt1');">Image 1</a><br />
<a href=http://www.htmlforums.com/archive/index.php/"/" onmouseover="rewriteImg('imageframe','alt2');">Image 2</a><br />
</tr><br />
<tr><br />
<td id="imageframe" width="40%" height="90%"><br />
<img src=http://www.htmlforums.com/archive/index.php/"img0.jpg" height="100%"><br />
</td><br />
<td id="cell for texttable" height="100%"><br />
</td><br />
</tr><br />
</table><br />
</body><br />
</html><!--content-->I think that you will be suprised u didnt know this...<br />
<br />
In the <table> tag, insert the following:<br />
<table cellpadding=0 cellspacing=0><!--content-->Well maybe this will surprise you, but it doesn't make any difference (if I understand you well). I added your addidtion within the table-tag (I added "" around your 0's)but the problem remains. Img0 fills the table cell completely in vertical sense, but if I link Img0 also to the link of "Image 1", the same image only partially fills that cell. and that's exactly want I want to avoid.<br />
Kippie<!--content-->Does it fill the height of it + not the width?<!--content-->No it doesn't fill the height nor the width. I will be happy already if it fills the height. For the width I can make some adaptation.<br />
Kippie<!--content-->Sorry, i'm not sure I can help you any further..<!--content-->the image1 and image 2 are stretching img0's cell is why you can't get the width.<br />
<br />
take out teh colspan=2 bit<!--content-->That makes no difference either, at leat not here with IE6 (if I misunderstand you please let me know). Moreover this colspan="2" is necessary in the final file which is more complex than this one. <br />
Kippie<!--content-->can you send me your 2 images you are using. actually 3. so I can test what you are seeing. cause if I use my images it looks fine.<!--content-->Hi scoutt,<br />
I really appreciate all your help. Hereby are files.<br />
Kippie<!--content-->That was only one. Here the second.<!--content-->this works for me. I took out the height in the table tag and added a close </td> tag.<br />
<br />
<br />
<html><br />
<head><br />
<script language="JavaScript"><!--<br />
alt1 = new Image();<br />
alt1.src = <!-- m --><a class="postlink" href="http://www.htmlforums.com/archive/index.php/">http://www.htmlforums.com/archive/index.php/</a><!-- m -->"image1.jpg";<br />
<br />
alt2 = new Image();<br />
alt2.src = <!-- m --><a class="postlink" href="http://www.htmlforums.com/archive/index.php/">http://www.htmlforums.com/archive/index.php/</a><!-- m -->"image2.jpg";<br />
// --><br />
</script><br />
<br />
<script language="JavaScript"><!--<br />
function rewriteImg(id,imgName){<br />
d=document;<br />
re=d.all?d.all[id]:d.getElementById(id);<br />
re.innerHTML="<img src='http://www.htmlforums.com/archive/index.php/"+eval(imgName + ".src")+"'>";<br />
}<br />
// --><br />
</script><br />
</head><br />
<br />
<body><br />
<table name="bigtable" border="1" bordercolor="purple" width="100%" cellspacing="0" cellpadding="0"><br />
<tr><br />
<td id="headmenu" colspan="2" height="9%"><br />
<a href=http://www.htmlforums.com/archive/index.php/"/" onmouseover="rewriteImg('imageframe','alt1');">Image 1</a><br />
<a href=http://www.htmlforums.com/archive/index.php/"/" onmouseover="rewriteImg('imageframe','alt2');">Image 2</a><br />
</td><br />
</tr><br />
<tr><br />
<td id="imageframe" width="226" height="301"><img src=http://www.htmlforums.com/archive/index.php/"img0.jpg" width="226" height="301"></td><br />
<td id="cell for texttable" >&nbsp;</td><br />
</tr><br />
</table><br />
</body><br />
</html><!--content-->Thanks Scoutt<br />
Kippie<!--content-->
 
You must log in or register to reply here.
Back
Top