CSS 表格元素内容的定位 0
作者：grace 来源：gracecode.com 发布时间：2008-08-01 17:31:00
标签：表格,定位,css
CSS 中的 position 属性可以很容易的将指定的元素定位到理想的位置。但在使用这一属性时需要注意，尤其是在表格元素中。为了说明此问题，我们先来看个 DEMO。
点击按钮后，图片所在的 td 的 CSS 属性 position 定义成 relative，但是除 Exploer 外其内部的绝对定位的层，没有重新定位到“期望的位置上”。
在这里有个详细的讨论，主要的原因可以基本上认定为 Exploer 与其他浏览器针对表格元素的理解不同所致。
The position and size of an element's box(es) are sometimes calculated relative to a certain rectangle, called the containing block of the element.
可以认为定位的父容器应为块（block）元素（td 默认的 display 属性为 tab-cell），而 Exploer 则没有遵循这一规范（所以得到了“期望的结果”）。
其实将 DEMO 中的相应 td 的 CSS 属性改成 display:block; 就能更好的说明问题（注意，将 td 的 display 属性改成 block，严格意义上理解，它已经不是表格的一部分了）。
要解决这问题，目前已知的一种做法就是在 td 中再套一层 div 等 block 元素。
这可能这又引起的另个问题，就是无法像表格元素一样垂直居中，不过我们可以参考这里的解决方案（更新，还有 小虎 的另种解决方案）。
--EOF--
0
投稿猜你喜欢
过滤器模板层对变量的操作实际还有很多，过滤器就是其中一种。学过Linux系统的一定知道管道操作符，其可以将上一步输出直接作为下一步输入进行处- 使用Python内置函数：bin()、oct()、int()、hex()可实现进制转换。先看Python官方文档中对这几个内置函数的描述：b
- 这是一个简易的员工管理系统，实现最简单的功能：1.登录用户密码验证（错误三次自动退出） 2.支持文本员工的搜索、添加、删除、修改 3.一级层
- 下面的代码是从kesion系统扒下的，确实不错，支持utf8格式。代码如下:'===========================
- Python 堆栈堆栈是一个后进先出(LIFO)的数据结构. 堆栈这个数据结构可以用于处理大部分具有后进先出的特性的程序流 . 在堆栈中,
- 本文实例讲述了python获取文件版本信息、公司名和产品名的方法,分享给大家供大家参考。具体如下：该python代码可得到文件版本信息、公司
- numpy norm()函数求范数函数：norm(x, ord = None, axis = None, keepdims = False)
- 从低版本迁移到MySQL 8后，可能由于字符集问题出现 Illegal mix of collations (utf8mb4_general
- python 与 C++ dlib人脸检测结果对比，供大家参考，具体内容如下说明：由于项目需求发现Linux下c++使用dlib进行人脸检测
- 本教程配置好后一劳永逸，不用再配置，每次只需要选择 Python 解释器即可打开KBEngine的服务器项目文件夹（资产目录）其主要工程目录
- 本文整理了3种鼠标经过图片，图片边框加粗或改变颜色的方法，希望大家喜欢。下面3中只是提供了一个方法，具体的鼠标经过图片的样式，你自己可以修改
- 我们的网络协议一般是把数据转换成JSON之后再传输。之前在Java里面，实现序列化和反序列化，不管是 jackson ,还是 fastjso
- 从大规模数据集中寻找物品间的隐含关系被称作关联分析或关联规则学习。过程分为两步：1.提取频繁项集。2.从频繁项集中抽取出关联规则。 频繁项集
- 本文实例讲述了python通过pil模块将raw图片转换成png图片的方法。分享给大家供大家参考。具体分析如下：python通过pil模块将
- 这里我昨天碰到的问题就是执行一段根据变量tableName对不同的表进行字段状态的更改。由于服务器原因，我不能直接在数据访问层写SQL，所以
- 前言我已经使用ES2015(ES6)的语法编写JavaScript程序很久了，并且喜欢上它提供的新特性带来的优雅和简洁。我最习惯的就是不再使
- 1.1. 前言众所周知，安服工程师又叫做Word工程师，在打工或者批量SRC的时候，如果产出很多，又需要一个一个的写报告的情况下会非常的折磨
- bcp是SQL Server中负责导入导出数据的一个命令行工具，它是基于DB-Library的，并且能以并行的方式高效地导入导出大批量的数据
- 概述:本文主要分享一下博主在学习wxpy 的过程中开发的一个小程序。博主在最近有一个监控报警的需求需要完成，然后刚好在学习wxpy 这个东西
- python中的with语句使用于对资源进行访问的场合，保证不管处理过程中是否发生错误或者异常都会执行规定的__exit__（“清理”）操作
