[2023-01-23] 4images 1.10 released
0 Members and 1 Guest are viewing this topic.
Quote from: GeO3x on February 20, 2008, 02:40:41 PMHi, I don't know what to do.. I want those tables that surround the image to be perfectly aligned! I see that if there is 2 different thumbnails - speaking of height - then a space it appears under the thumbnail - check the attached pic..Any ideea?!Change your thumbnail_bit.html to thisCode: [Select]<table class="thumb" onmouseover="this.className='thumb2'" onmouseout="this.className='thumb'" border="1" cellspacing="1" style="border-collapse: collapse" bordercolor="#C0C0C0" id="AutoNumber1" > <tr> <td align="center"> <table border="1" cellspacing="1" style="border-collapse: collapse" bordercolor="#808080" id="AutoNumber2" title="{image_name}"> {thumbnail} </table> </td> </tr> </table><div class="info"><p align="left" class="cat">{image_name}{if image_is_new}<span class="new">{lang_new}</span>{endif image_is_new}</p> <div align="left"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> {if categories}<td><p class="category"><a href="{cat_url}">{cat_name}</a></p></td>{endif categories} {if allow_comments}<td><p class="comment">{image_comments}</p></td>{endif allow_comments} <td><p class="user">({user_name_link})</p></td> </tr> </table> {lightbox_button} </div></div>you can see here http://www.myanimalsworld.com how looks that.
Hi, I don't know what to do.. I want those tables that surround the image to be perfectly aligned! I see that if there is 2 different thumbnails - speaking of height - then a space it appears under the thumbnail - check the attached pic..Any ideea?!
<table class="thumb" onmouseover="this.className='thumb2'" onmouseout="this.className='thumb'" border="1" cellspacing="1" style="border-collapse: collapse" bordercolor="#C0C0C0" id="AutoNumber1" > <tr> <td align="center"> <table border="1" cellspacing="1" style="border-collapse: collapse" bordercolor="#808080" id="AutoNumber2" title="{image_name}"> {thumbnail} </table> </td> </tr> </table><div class="info"><p align="left" class="cat">{image_name}{if image_is_new}<span class="new">{lang_new}</span>{endif image_is_new}</p> <div align="left"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> {if categories}<td><p class="category"><a href="{cat_url}">{cat_name}</a></p></td>{endif categories} {if allow_comments}<td><p class="comment">{image_comments}</p></td>{endif allow_comments} <td><p class="user">({user_name_link})</p></td> </tr> </table> {lightbox_button} </div></div>
<div class="info"><p align="left" class="cat">{image_name}{if image_is_new}<span class="new">{lang_new}</span>{endif image_is_new}</p> <table width="100%" border="0" cellspacing="0" cellpadding="0"align="left"> <tr> {if categories}<td><p class="category"><a href="{cat_url}">{cat_name}</a></p></td>{endif categories} {if allow_comments}<td><p class="comment">{image_comments}</p></td>{endif allow_comments} <td class="user">{user_name_link})<br /><br />{lightbox_button}</td> </tr> </table></div>
Thanks Kurt for your quick reply,but it doesn't function.BTW, I tried to attach a screenshot, but I can't post then...
.thumb { border: 1px solid #e8e8e8; background: #f5f9fc; cursor: pointer; padding: 14px;}.thumb2 { border: 1px solid #cde0f0; background: #edf4fa; cursor: pointer; padding: 14px;}
.thumb { border: 1px solid #e8e8e8; background: #f5f9fc; cursor: pointer; padding: 14px; height: 200px;/* Or any suitable height*/}.thumb2 { border: 1px solid #cde0f0; background: #edf4fa; cursor: pointer; padding: 14px; height: 200px;/* Or any suitable height*/}
{thumbnail}
<br /><b>{image_name}</b>{if image_is_new} <sup class="new">{lang_new}</sup>{endif image_is_new}<br />{if allow_comments}{lang_comments} {image_comments}{endif allow_comments}<br />{user_name}