I'm using dreamweaver and php to return a list of images based on search critiera. I have used Dreamweaver's repeat function and can get the images to repeat below each other (as below).
<table width="100" height="38" border="1">
<?php do { ?>
<tr>
<td width="38">
<img class='example' src="images/<?php echo $row_getresult['image_name']; ?>.png"/><br>
</a></td></tr>
<?php } while ($row_getamenityaccommodation = mysql_fetch_assoc($getamenityaccommodation));
?>
</table>
How can I get the images to go across from each other within a CSS Div e.g. float:left; width:45%; so that if there are more images than what would fit in 45%, the images would continue onto a new line?
Would somehow 'printing' the array work?
Remove the table and replace with
<div style='width:45%'>
<?php do{ ?>
<img style='float:left;class='example' src="images/<?php echo $row_getresult['image_name']; ?>.png"/>
<?php } while ($row_getamenityaccommodation = mysql_fetch_assoc($getamenityaccommodation)); ?>
</div>
or for a more semantic version use a ul since you are showing a list of images.
<ul class='gallery'>
<?php do{ ?>
<li><img style='float:left;class='example' src="images/<?php echo $row_getresult['image_name']; ?>.png"/></li>
<?php } while ($row_getamenityaccommodation = mysql_fetch_assoc($getamenityaccommodation)); ?>
</ul>
and in css
ul.gallery {
width: 45%;
list-style: none;
margin:0; padding:0;
}
ul.gallery li {
float:left;
padding: 5px;
}