`
白云飞
  • 浏览: 33737 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

firefox中span标签的width设置

阅读更多

firefox,IE中默认span标签设置width值无效,宽度显示只根据内容长短变化
解决办法如下:

span{}{
   display:-moz-inline-box; /**//*firefox支持*/
   display:inline-block; /**//*IE中*/
   width:120px;
   border:1px solid #ff0000;
} 

 

分享到:
评论

相关推荐

    CSS中如何把Span标签设置为固定宽度.pdf

    在本文中,我们将探讨如何在不同情况下将Span标签设置为固定宽度,并理解不同display属性的差异。 首先,让我们了解为何直接给Span标签设置width属性无效。这是因为按照CSS标准,对于inline元素,width和height属性...

    CSS中将Span标签设置为固定宽度的方法

    在CSS(层叠样式表)中,`<span>` 是一个常见的内联元素,通常用于在文本中设置特定部分的样式。然而,由于`<span>` 默认是内联元素,它的宽度不能直接设置,因为内联元素会尽可能地在一行内显示其内容,而不考虑...

    firefox下溢出部分省略号显示

    在Firefox浏览器中,开发者可以利用CSS属性来实现这一效果,使得当文本内容超出指定区域时,以省略号(...)的形式隐藏多余的部分。这一技术在网页设计中尤为实用,可以保持页面的整洁和易读性。 首先,我们需要了解...

    设置span宽度高度的方法

    在旧版Firefox浏览器(2.0)中,使用`-moz-inline-box`来保持兼容性。 3. **设置宽高**:通过`width: 150px`和`height: 100px`,我们设定了`<span>`元素的宽度和高度。 4. **边框**:`border: 1px solid #000;`添加...

    在Firefox或IE中span无法确定宽度的解决方案

    比如在本案例中,遇到的问题是在主流的Web浏览器Firefox和IE中,<span>标签无法设置宽度。 在HTML中,<span>是一个内联元素(Inline Element),默认情况下没有固定的宽度和高度。如果开发者尝试通过CSS为<span>...

    span无法设置宽度的问题的解决方法

    这个老版本的Firefox(Gecko引擎)前缀属性可以帮助在那些不支持`inline-block`的浏览器中实现类似的效果。 示例代码如下: ```css span { display: -moz-inline-box; /* For old Firefox */ display: inline-...

    设置span 宽度的完美解决方案

    但是,你可能会发现,这样的设置并不奏效,尤其是在Firefox和IE这样的主流浏览器中。经过查阅CSS2标准文档,我们得知`width`属性仅对那些是块级(block-level)元素的标签有效。由于`<span>`默认是内联元素,其`...

    HTML中Li标签的使用示例

    在现代浏览器(如IE8及以上版本和Firefox)中,这个方法工作得很好,但在IE6和IE7中,可能会导致元素换行,因为这些旧版浏览器的CSS解析存在差异。 为了解决这个问题,我们可以采用以下策略: 1. **清除浮动**:在...

    最全的CSS浏览器兼容问题整理(IE6.0、IE7.0 与 FireFox)

    ### 最全的CSS浏览器兼容问题整理(IE6.0、IE7.0 与 Firefox) 在Web开发过程中,确保网站能够在不同的浏览器上正确显示是非常重要的一步。尤其在早期的Web开发时代,面对像IE6、IE7这样的浏览器,以及当时主流的...

    Ajax仿谷歌自动完成功能(支持Firefox请看下载说明)

    要兼容火狐请代码中XMLHttp.readystate=4更改为XMLHttp.readyState=4 另var key=lis[i].innerHTML.substring(0,lis[i].innerHTML.indexOf("<SPAN>"));这一行更改为: var key=lis[i].innerHTML.substring(0,lis[i]....

    用css使单行超出指定宽度的内容切去并在结尾出现省略号

    然后,我们设置`p`标签的样式来清除浮动,`span`的样式来浮动左并限制最大宽度,`::after`伪元素来添加省略号: ```css p { clear: both; } p span { float: left; max-width: 175px; /* 容器宽度减去省略号...

    IE6不支持CSS中的min-width/height属性问题的解决方法

    在IE6中,若仅使用width或height属性,它会默认为元素提供一个最小尺寸的特性,但这种方式在其他现代浏览器中并不适用,比如在Firefox或IE7中,这样的设定会被视为固定的尺寸,元素不会随内容的增加而自动扩展。...

    li在ie/firefox浏览器中行高不一致解决方法(浏览器兼容)

    复制代码代码如下: <...}.tu_freeline_list li span{float:left;height:30px;overflow:hidden;width:155px;font-size:12px;}.tu_freeline_list li strong{float:right;font-size:12px;}</style><ul cla

    jquery 仿制苹果系统导航菜单

    基于jquery做的网页版仿苹果系统导航菜单,效果非常流畅 华丽 不解释。。。 用法: 在页面头部标签<head></head>中加入下面的代码 ...我已经在IE 6, IE 7, Opera 9, Firefox 2, Firefox 3 and Safari 2上测试通过。

    div+css布局中常用方法汇总.pdf

    13. **Flash遮挡问题**:通过设置`wmode="opaque"`可以解决Flash遮挡其他元素的问题,对IE和Firefox分别在`param`和`embed`标签中设置。 14. **图片边距问题**:在IE6中,图片默认有额外边距,设置`display:block`...

    div+css布局中常用方法汇总.docx

    针对IE和Firefox,分别在`param`和`embed`标签中设置。 15. **图片边距问题**:在IE6中,图片默认有额外边距,通过设置`display:block`可以消除这个问题。 16. **代码命名规范**:采用有意义的命名,如`search`...

Global site tag (gtag.js) - Google Analytics