/    Sign up×
Community /Pin to ProfileBookmark

side by side thumb nails

Copy linkTweet thisAlerts:
Nov 21.2006

Hi

I have a page that displays thumb nails of images stored in a mysql table. the thumb nails are placed in a table. I cannot figure out how to get the photos to go beside each other until the space is full then move to the next line.

any help or pointers on how to do this is great

to post a comment
PHP

6 Comments(s) ↴

Copy linkTweet thisAlerts:
@chadillacNov 21.2006 — just place them in line with a space between each one, then place them in a div aligned center

[code=html]
<div align="center">
<img src="foobar.jpg"> <img src="foobar.jpg"> <img src="foobar.jpg">
<div>
[/code]

The browser will auto wrap on the " " thus knocking images to left to make room on the right.

example : http://outlet.cableorganizer.com/ look at the bottom
Copy linkTweet thisAlerts:
@kprocauthorNov 22.2006 — The below code is what gets my photos and displays them as thumb nails. as mentioned above it lists it one under another. I want to display them side by side within the allowable space but cannot figure it out

any help is great

[code=php]
while ($row=mysql_fetch_object($result)){

echo "<a HREF ="getImage.php?Photo_id=$row->Photo_id">
<IMG SRC="getImage.php?Photo_id=$row->Photo_id" width=100 Height=150 alt=$row->name><br>
<a>$row->name</a> &nbsp;
<a href="deletephoto.php?Photo_id=$row->Photo_id" title='Delete Image'>Delete</a>";

}
[/code]
Copy linkTweet thisAlerts:
@kprocauthorNov 22.2006 — HI

I'm trying to set the thum nails in the thumb nailes in a table, I'm having a hard time piecing the syntax together. can someone help me through it thatnak you

[code=php]
<table>
<tr>
<td>

<a HREF ="getImage.php?<?php echo Photo_id=$row->Photo_id; ?>">
<IMG SRC="getImage.php?<?php echo Photo_id=$row->Photo_id; ?>" width=75 Height=75 alt=<?php echo $row->name>; ?><br>
<a><?php echo $row->name; ?></a> &nbsp;
<a href="deletephoto.php?<?php Photo_id=$row->Photo_id; ?>" title='Delete Image'>Delete</a></div>

</td>

</tr>
</table>
[/code]
Copy linkTweet thisAlerts:
@NogDogNov 22.2006 — [code=php]
while ($row=mysql_fetch_object($result))
{
echo "<div class="thumb"><a HREF ="getImage.php?Photo_id=$row->Photo_id">
<IMG SRC="getImage.php?Photo_id=$row->Photo_id" width=100 Height=150 alt=$row->name><br>
<a>$row->name</a> &nbsp;
<a href="deletephoto.php?Photo_id=$row->Photo_id" title='Delete Image'>Delete</a></div>";
}
echo "<div class="clear"></div>n"; // clear the floats
[/code]
In your CSS stylesheet or in the <style> block in the head section of your page:
<i>
</i>.thumb {
float: left;
margin: 0;
padding: 10px; /* change margin and/or padding as desired */
}
.clear { /* used to "clear the floats" */
font-size: 1px;
height: 1px;
margin: 0;
padding: 0;
clear: both;
}
Copy linkTweet thisAlerts:
@kprocauthorNov 22.2006 — HI

This is what I have and kinda works. the problem it is it keeps adding cells to the right and does not stop when it runs out of space. how do I get it to start an other row when it runs out of room

[code=php]
<tr>
<table>
<? while ($row=mysql_fetch_object($result)){ ?>

<td width="100" valign="middle">

<a HREF ="getImage.php?Photo_id=<?php echo $row->Photo_id;?>">
<IMG SRC="getImage.php?Photo_id=<?php echo $row->Photo_id; ?>" alt= <?php echo $row->name; ?> width=75 Height=75 align="middle"><br>
<a><?php echo $row->name; ?></a>
<a href="deletephoto.php?Photo_id=<?php echo $row->Photo_id; ?>" title='Delete Image'>D</a></td>


<? } ?>
</tr>
</table>

<?php

[/code]
Copy linkTweet thisAlerts:
@kprocauthorNov 22.2006 — sorryNogDog I did not realize you redid it al for me ?
×

Success!

Help @kproc spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.4,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...