如何让DIV在内容不固定的情况下宽度刚好显示完内容

原创 2007年09月29日 09:07:00

一般来说,TABLE默认情况下,TD的宽度会随着内容的变化而变化,而且宽度为内容的实际宽度,这样省去了很多容器自适应宽度的代码。

由于DIV是block级别元素,DIV的默认宽度是100%的浏览器分辨率宽度。所以在DIV里面的内容不够多时,会有一大段留白:

引用代码:

<div style="border: 1px solid #ddd;">测试DIV自适应宽度为正好能显示完内容</div>

输出效果:

测试DIV自适应宽度为正好能显示完内容

由以上的效果我们看到,确实有一大段的留白。那么如何消除这段留白,让DIV刚刚好显示完内容呢?

当然,用float可以解决这个问题。但此次不用float。

引用代码:

<div style="border: 1px solid #ddd; display: inline;">测试DIV自适应宽度为正好能显示完内容</div>

输出效果:

测试DIV自适应宽度为正好能显示完内容

可以看到,效果为正好显示完里面的内容,右边的留白被去掉了。达到了所想要的效果。这里只是将DIV的默认属性改变了一下,由缺省的block改变为inline。

原文地址:http://blog.doyoe.com/article.asp?id=6

版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

MC表-各情况下在内的顶点

#define X 255 unsigned char InVertexTable[256][8] = { {X, X, X, X, X, X, X, X}, {0, X, X, X, X, X,...

openfire在内网的情况下 文件传输代理的设置

openfire在内网中的时候,无法作文件传输代理,因为客户端要发文件时会发一个iq, 服务器在响应中会把proxy的IP,对方的IP带上,但是proxy的IP是内网IP,如果2个客户端不在同一个网段...

Android Paint Stroke某些情况下边框宽度显示一半原因

Android Paint Stroke某些情况下边框宽度显示一半原因

固定宽度下拉列表中option内容显示不全问题解决方法

动态显示,在鼠标点中后显示完整的列表,离开后显示缩略的列表。 公司项目中,很多页面都用到了select组件模拟树状选择框,由于树的层次可能非常多,因此的选择项内容非常长,而超出固...

在宽度确定的情况下高度自适应

CSS今日感悟最近在制作一个网页,在制作该网页的过程中习得了一些奇技淫巧,特来记录分享

实现三个并排div,两边固定宽度,中间自适应的四个方法

看了些文档和网上的资源,大概有四种方法。如有错误,欢迎各位指正。以下先贴代码再来解释 三个div并排 *{ margin: ...

实现三个并排div,两边固定宽度,中间自适应的四个方法

个人整理的实现三个并排div,两边固定宽度,中间自适应的四个方法,废话不多说,先上代码,可以直接复制看效果。 Document html,body{width:100...

iOS笔记UI--固定宽度,根据内容动态改变高度

声明:此为本人学习笔记,若有纰漏错误之处的可留言共同探讨 #import "ViewController.h" #define TEST_TEXT @"这个是测试用的这个是测试用的这个是测试用的这个...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)