我的所有图像都按顺序放置,但在第三行中,我的图像与上面的图像不对齐。我不知道问题是什么。事实上,直到管理员上传了一个空白文件的图像图像,它才正常工作,但问题已经解决,当再次上传图像时,问题开始出现。这是我的问题的链接。
http://hurdec.org.np/about_us.php
<?php
$about = sliding_image();
while($about_fetch=mysql_fetch_array($about)){
?>
<div class="row">
<div class="span3">
<div class="team-member">
<div class="team-member-preview">
<img src="images/<?php echo $about_fetch["image_name"];?>" alt="">
<div class="team-member-hover">
<div class="social-media fixed">
<a class="youtube-icon social-icon" href="#">
<i class="fa fa-youtube"></i>
</a>
<a class="pinterest-icon social-icon" href="#">
<i class="fa fa-pinterest"></i>
</a>
<a class="facebook-icon social-icon" href="#">
<i class="fa fa-facebook"></i>
</a>
<a class="twitter-icon social-icon" href="#">
<i class="fa fa-twitter"></i>
</a>
</div><!-- end .social-media -->
</div><!-- end .team-member-hover -->
</div><!-- end .team-member-preview -->
<h5><?php echo $about_fetch["name"];?></h5>
<p class="mute"><?php echo $about_fetch["qualification"];?></p>
<div class="adjust_about">
<h5> Areas of Expertise </h5>
<ul>
<li><?php echo $about_fetch["area_of_expertise"];?> </li>
</ul>
</div>
</div><!-- end .team-member -->
</div><!-- end .span3 -->
<?php
}
?>
</div>
</div>
</div>
<div class="row">
<div class="span12">
<div class="divider single-dotted"></div>
</div><!-- end .span12 -->
</div><!-- end .row -->
这是因为Yadap的简历比其他人短。添加
<br clear="left" />
每4个生物后。
首先,删除
<div class="row">
来自循环。您应该只定义一次,然后在其中附加span3元素。像这样:
<div class="row">
<?php
$about = sliding_image();
while($about_fetch=mysql_fetch_array($about)){
?>
<div class="span3">
</div>
<?php
}
?>
此外,团队成员类应该有一个固定的高度,就像您现在的代码一样。当其中一个比另一个矮时,你就会遇到现在的麻烦。
您还可以向一行添加4个元素,然后关闭该行并为接下来的四个元素打开一个新行标记。