css 分栏高度自动相等
方法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%;}
css 分栏高度自动相等的更多相关文章
- 纯CSS实现侧边栏/分栏高度自动相等
by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=694 一.为何要分栏高 ...
- 纯CSS兑现侧边栏/分栏高度自动相等(转)
这里直接介绍我认为的最佳的侧边栏/分栏高度自动相等方法.核心的CSS代码如下(数值不固定): margin-bottom:-3000px; padding-bottom:3000px; 再配合父标签的 ...
- CSS 分栏结构
CSS 固定左侧导航栏 left----左侧菜单 cont -- 实际内容 right ---右侧附加内容 两栏布局---左侧高度为内容撑开的高度 方法一:[坏处是需要 float] ...
- css笔记 - column分栏
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- CSS3-column分栏
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- CSS实现各类分栏布局
在CSS中,实现分栏布局有两种方法.第一种方法是使用四种CSS定位选项(absolute .static.relative和fixed)中的绝对定位(absolute positioning),它可以 ...
- css遮罩蒙版效果 分栏效果
mask遮罩蒙版效果 来看一下效果图: 这是两张原图: 遮罩层图像 注意,白色区域为透明状态 要展示的图像 使用mask之后产生的效果图 首先来解释一下遮罩.蒙版.和PS中的蒙版.Flash中 ...
- Word中摘要和正文同时分栏后,正文跑到下一页,怎么办?或Word分栏后第一页明明有空位后面的文字却自动跳到第二页了,怎么办?
问题1:Word中摘要和正文同时分栏后,正文跑到下一页,怎么办?或Word分栏后第一页明明有空位后面的文字却自动跳到第二页了,怎么办? 答:在word2010中,菜单栏中最左侧选“文件”->“选 ...
- 右边根据左边的高度自动居中只需要两行CSS就可以完成
右边根据左边的高度自动居中只需要两行CSS就可以完成 <style type="text/css" > div{ display: inline-block; vert ...
随机推荐
- 关于最新的Vuforia-unity3d-samples2-8-13
今天用了一下最新的Vuforia for unity3d的样例2-813版本号.导入我的unity3d之后.发现ARCamera的检视面板下非常多熟悉的元素都不见了,根本没法改动标志,如图所看到的. ...
- Jquery easyui教程
目 录 1基本拖放.......................................................................................... ...
- 中国餐馆过程(Chinese restaurant process)
也就是说假设空桌子有a0个人,然后顾客选择桌子的概率和桌子上人数成正比. 性质: 改变用户的排列方式,桌子的排列方式,概率不变换.
- 10 个很有用的高级 Git 命令(转)
英文原文:10 Useful Advanced Git Commands 迄今,我已经使用Git很长一段时间了,考虑分享一些不管你是团队开发还是个人项目,都受用的高级git命令. 1. 输出最后一次提 ...
- php -- 实现linux关机、重启功能
有时候,我们自己可以DIY一个控制面板实现linux的关机重启功能.众所周知,linux是一个基于文件的操作系统,所以要实现系统的关机重启功能必须满足以下两点 一.知道命令的绝对路径 在linux下操 ...
- 扫盲:java中关于路径的问题
../FileName:当前工程的上级目录. ./FileName:当前工程所在的目录. /FileName:当前工程所在磁盘的根目录(windows下). FileName:当前工程所在的目录.
- 【Java面试题】54 去掉一个Vector集合中重复的元素
在Java中去掉一个 Vector 集合中重复的元素 1)通过Vector.contains()方法判断是否包含该元素,如果没有包含就添加到新的集合当中,适用于数据较小的情况下. import jav ...
- openal 基础知识
原文地址:http://blog.csdn.net/woker/article/details/8687380 一简介 OpenAL抽象出三种基本对象:buffers(缓冲区).sources(源). ...
- eclipse项目配置tomcat后浏览器访问不到项目解决方案
先把项目从tomcat溢出,并删除tomcat,然后再次导入 双击: 修改:
- DLL文件的使用
一. 动态链接库 什么是动态链接库?DLL三个字母对于你来说一定很熟悉吧,它是Dynamic Link Library 的缩写形式,动态链接库 (DLL) 是作为共享函数库的可执行文件.动态链接提供了 ...