`
fireinjava
  • 浏览: 480100 次
  • 性别: Icon_minigender_1
  • 来自: 福州
社区版块
存档分类
最新评论

float: right 换行的解决办法

    博客分类:
  • html
 
阅读更多

转自http://renxiangzyq.iteye.com/blog/387442

1、float: right的简单用法:使用代码<span style="float: right"> ****** </SPAN>,其中******就是你调用的元素,比如发布日期:{dateline},如果想让此元素靠右,则相应为:<span style="float: right">{dateline} </SPAN>;
2、当使用span时,很多站长反映:靠右的元素和前面的元素被自动换行了,即不再在同一行内,原因是:当非float的元素和float的元素在一起的时候,如果非float元素在先,那么float的元素将被排斥。

也就是说:如果你在设置span是float:right时,把他放在所有元素的最前面就正常了,以下为举例(攻击调用三个元素,想让第三个元素靠右显示):
按顺序输入的方法是错误的: {forum}{subject}<span style="float: right">{dateline} </SPAN> <br />
正确的方法:<span style="float: right">{dateline} </SPAN>{forum}{subject}<br />

分享到:
评论

相关推荐

    CSS中右对齐float:right换行的解决办法

    第二种解决办法:给右边也加上FLOAT:RIGHT 浮动不正常的(不在同一行,换行了,仅仅因为多了一个&nbsp;,从而导致整个排版混乱): 浮动正常的1:(第一种解决办法:去掉&nbsp;) 浮动正常的2:(第二...

    E7 float:right 时元素换行出现在下一行的bug解决方法

    在网页布局设计中,`float`属性是一个至关重要的CSS特性,它允许元素脱离其正常文档流,从而可以创建多列布局、对齐...然而,在还需要支持旧版IE浏览器的项目中,理解并解决`float:right`引起的换行问题仍然是必要的。

    css中float:right右对齐元素会换行不在同一条线上

    CSS中通常我们需要将某元素居左、居右显示,这个时候我们就可以根据float来设置,在设置右对齐显示的时候,我们通常会遇到,右对齐的元素会换行,这样就会出现左右元素不在同一条线上,我们可以通过以下方式来解决这...

    IE7 float:right 右浮动时元素换行错位的bug解决方法

    本文将详细讨论`float:right`在IE7中遇到的元素换行错位问题以及如何解决这个问题。 首先,我们需要理解`float`属性的工作原理。`float`属性允许元素脱离其正常文档流,向左或向右移动,直到其边缘碰到容器的边框或...

    css给span加float:right右浮动后内容换行下移

    然而,在某些情况下,这可能会导致意想不到的布局问题,比如"span加float:right右浮动后内容换行下移"的问题,这个问题在描述中已经明确指出。 首先,让我们回顾一下上述示例代码: ```html &lt;!DOCTYPE html&gt; ...

    float元素浮动后高度不一致导致错位的解决办方法

    但是当高度不一致时,就需要想别的办法来解决了: 1、给父元素定义font-size:0; 浮动子元素定义需要的font-size, 再定义display:inline-block;vertical-align:top; 复制代码代码如下: ul{ margin:0; padding:0; ...

    通过float实现两个div不换行

    在这个例子中,我们没有对`div#row2`设置`float:right`,但它依然可以作为参考,如果需要将`row2`放在`row1`的右边,只需将颜色改为红色并添加`float:right`。 3. `float: none;` 默认情况下,所有元素的`float`...

    CSS之float在IE浏览器下换行问题解决方法

    在本篇内容中,我们主要探讨的是a标签在使用浮动属性时,在IE浏览器下换行的问题以及相应的解决办法。 首先,关于float属性,它主要有三个值:left、right和none。当元素使用float:left时,元素会向左浮动;使用...

    div中加入span右对齐后出现换行显示两种解决思路

    就类似说空间里面模块中模块名靠左,编辑字样出现在靠右...复制代码代码如下: .portlet span { float:right } 这个时候就发现出现一个问题“文章”跟“编辑”不在同一行中!这下苦闷了!于是只好去搜了问题原因如下

    css float属性_动力节点Java学院整理

    浮动(Float)是CSS布局中的一个关键概念,它主要用于创建多列布局...然而,随着CSS3的不断发展,现代布局技术如Flexbox和Grid已经提供了更强大、更灵活的布局解决方案,但在某些情况下,`float`仍然是一个实用的工具。

    5个DIV并排在一行的一种方法

    &lt;... &lt;head&gt; &lt;title&gt;一种5个DIV并排在一行的方法&lt;/title&gt;...style type=”text/css”&... float:right; background:#0f0; } #d3 { float:right; background:#00f; } #d4 { float:right; background

    ie7中overflow:auto无效的解决方法

    /* 解决 IE7 中 float:right 换行问题 */ .parent { position: relative; /* 添加此行 */ } .child-float-right { float: right; /* 保持不变 */ position: absolute; /* 添加此行 */ right: 0; /* 需要根据...

    css中float left与float right的使用说明

    `float`主要有两个值:`left`和`right`。 `float:left`意味着元素将向左浮动,它会尽可能地靠近左边界的边缘,同时允许其他非浮动元素在其右边排列。如果一个容器内有多个左浮动元素,它们会按照从左到右的顺序排列...

    多个div能不换行吗?

    2. **使用 `float` 属性**:将 `div` 设置为浮动元素,它们会在其父容器中尽可能多地靠左(`float: left`)或靠右(`float: right`)排列。但是,这种方法可能导致父元素高度塌陷,需要额外的清理样式来修复。例如:...

Global site tag (gtag.js) - Google Analytics