html - 显示缩略图并排显示而不是在 MYSQL/PHP 下方

Question

早上好

我正在创建一个个人资料页面，我想在其中显示彼此相邻的缩略图，并在单击按钮时弹出包含信息的叠加层。除了缩略图显示在单独的行中之外，我可以让一切正常工作，而我希望它们并排显示。

如果没有覆盖层代码，它们会彼此相邻显示，但覆盖层无法正常工作。目前在 catch22...

有什么建议吗？

谢谢

<?php
  $result = mysql_query("SELECT * FROM People ORDER BY Position,Number");
  while($row = mysql_fetch_assoc($result)){
      echo '<div class="box" ><div id="triggers">',
           '<img src="profile/'.$row['Id'].'.jpg" rel="#mies'.$row['Id'].'"/>',
           '</div>',
           '<div class="simple_overlay" id="mies'.$row['Id'].'" align="center">',
           '<div class="details">',
           '<img src="profile/'.$row['Id'].'l.jpg" />',
           'Name: <b>'.$row['FirstName'].' '.$row['Surname'].'</b></br>',
           'Position: <b>'.$row['Position'].'</b> Number: <b>'.$row['Number'].'</b></br>',
           'Years With Saxons: <b>'.$row['YrsWithSaxons'].'</b></br>',
           'Previous Teams: <b>'.$row['PreviousTeams'].'</b></br>',
           'Favourite NFL Team: <b>'.$row['NFLTeam'].'</b></br>',
           'Favourite NCAA Team: <b>'.$row['NCAATeam'].'</b></br>',

           '</div></div>';
    }
?>

Answer 1

您可能会为“box”元素添加一些样式到您的 css 中。 添加“ float :左；”可能还有一个“margin-right: 10px;”，如果你愿意，可以将它们隔开一点。 请务必包含 <div style="clear:both"></div>在您的 html 中的最后一个框之后。