div和css图片横排的问题
<title>K2gether</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<style type="text/css">
.abgne_tip_gallery_block {
margin: 0;
padding: 0;
width: 450px;
height: 250px;
overflow: hidden;
position: relative;
}
.abgne_tip_gallery_block img {
position: absolute;
border: 0;
}
.abgne_tip_gallery_block .caption {
position: absolute;
top: 195px; /* .abgne_tip_gallery_block 的高 - 想显示 title 的高(这边是设 55) */
width: 450px; /* .abgne_tip_gallery_block 的宽 - .caption 的左右 padding */
padding: 15px 10px 20px;
cursor: pointer;
color: #FFFFFF;
background: #3c414a;opacity:0.7;
}
.abgne_tip_gallery_block .caption h2 {
margin: 0;
padding: 0px 0px 15px;
}
.abgne_tip_gallery_block .caption h2 a {
text-decoration: none;
color: #FFFFFF;
}
.abgne_tip_gallery_block .caption h2 a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<div class="abgne_tip_gallery_block">
<img src="http://i.imgur.com/1qt5pRB.jpgjpg" width="450" hight="195" title="会员资格" />
<div class="caption">
<h2><title="会员资格">会员资格</h2>
<div class="desc" style="padding-right:10px;">
只要满20件(10KG)就可加入会员
</div>
</div>
</div>
<div class="abgne_tip_gallery_block">
<a href="#"><img src="http://i.imgur.com/C6CPMV5.jpg" width="450" top="195" title="" alt="" /></a>
<div class="caption">
<h2><title="瑕疵处理">瑕疵处理</h2>
<div class="desc">
收到货物有商品有任何问题，请两天内与我们联系
</div>
</div>
</div>
<script type="text/javascript">
$(function(){
// 预设标题区块 .abgne_tip_gallery_block .caption 的 top
var _titleHeight = 55;
$('.abgne_tip_gallery_block').each(function(){
// 先取得区块的高及标题区块等资料
var $this = $(this),
_height = $this.height(),
$caption = $('.caption', $this),
_captionHeight = $caption.outerHeight(true),
_speed = 200;
// 当滑鼠移动到区块上时
$this.hover(function(){
// 让 $caption 往上移动
$caption.stop().animate({
top: _height - _captionHeight
}, _speed);
}, function(){
// 让 $caption 移回原位
$caption.stop().animate({
top: _height - _titleHeight
}, _speed);
});
});
});
</script>
</body>
</html>
图片无法并排
找不出原因
恳请帮忙
求求帮帮我
虽然我赏金不高
但是这是我的全部
.abgne_tip_gallery_block{float:left;}这个css加上float即可
