正文

css 分栏高度自动相等

IP云
IP云V管理员/6 阅读
08/25
提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

方法2:

<div class="ticket_table">
<div class="ticket_l">
<h3>全票</h3>
</div>
<div class="ticket_r">
<div class="item">
<span>蓬莱八仙过海景区</span><em>￥80元/人</em><a href="javascript:;">立即预订</a>
</div>
<div class="item">
<span>蓬莱三仙山风景区</span><em>￥120元/人</em><a href="javascript:;">立即预订</a>
</div>
<div class="item">
<span>蓬莱三仙山风景区</span><em>￥120元/人</em><a href="javascript:;">立即预订</a>
</div>
<div class="item">
<span>蓬莱三仙山风景区</span><em>￥120元/人</em><a href="javascript:;">立即预订</a>
</div>
</div>
</div>

.inner_article_box .ticket_price .ticket_table{width:100%;overflow:hidden;height:100%;position:relative;}
.inner_article_box .ticket_price .ticket_l{float:left;width:110px;border-left:1px solid #dbdbdb;border-top:1px solid #dbdbdb;background:#f9f9f9;overflow:hidden;height:100%;position: absolute;left:0;top: 0;}
.inner_article_box .ticket_price .ticket_l h3{width:100%;position:absolute;top:50%;font-size:20px;font-weight:bold;color:#676767;margin-top:-15px;text-align:center;}
.inner_article_box .ticket_price .ticket_r{float:right;width:646px;height:100%;border-left:1px solid #dbdbdb;border-top:1px solid #dbdbdb;}

方法1:

.inner_article_box .ticket_price .ticket_table{width:100%;overflow:hidden;height:100%;position:relative;}
.inner_article_box .ticket_price .ticket_l{float:left;width:110px;overflow:hidden;height:100%;padding-bottom:3000px;margin-bottom:-3000px;}
.inner_article_box .ticket_price .ticket_l h3{width:100%;font-size:20px;font-weight:bold;color:#676767;text-align:center;}
.inner_article_box .ticket_price .ticket_r{float:right;width:646px;height:100%;}