草庐IT

floating-planet

全部标签

html - 文本环绕 float 的 div 但边框和 <hr/> 不环绕

我有一个div是float:right它在父div中。有p元素也在同一个父div中,文本环绕float:rightdiv正确。但是,如果我设置p元素有边框,或者做一个,边框不会在文本停止的地方停止,而是延伸到float:right后面分区这是一个漂亮的mspaint描述:注意黑色横线的绿色部分在floatdiv的后面。如何获取边框或或者任何与文本一样宽的东西,而不是在div后面? 最佳答案 我知道这个问题是前段时间发布的,但我今天遇到了同样的问题并找到了另一个解决方案:http://jsfiddle.net/MvX62/我使用bor

javascript - 如何保持 float div 在窗口调整大小时居中 (jQuery/CSS)

有没有办法(不绑定(bind)到window.resize事件)在调整浏览器窗口大小时强制floatDIV重新居中?为了帮助解释,我想伪代码应该是这样的:div.left=50%-(div.width/2)div.top=50%-(div.height/2)更新我的查询已在下面得到回答,我想发布我的探索的最终结果-一个jQuery扩展方法,允许您将任何block元素居中-希望它也能帮助其他人。jQuery.fn.center=function(){varcontainer=$(window);vartop=-this.height()/2;varleft=-this.width()/2

html - 具有自己的流程的 CSS float 注释

更新我提供了赏金,但从未获得正确答案。我已经实现了一个适合我的JS解决方案,但我现在还不打算将答案标记为正确。如果仅使用CSS/HTML是可能的,我仍然很乐意看到它。但普遍的共识是目前不可能。目标CodePenhere,底部的可运行代码段。我有一些HTML内容,我想在其上方直接float一条小消息进行注释,在最左侧,有点像注释(但不完全是)。可以有很多内容,每个内容都有自己的注释。内容必须遵循正常的文本流。这是我当前的HTML:nopeIt'sabird,stillnoit'saplane,yeah!it'sSuperman!muahahaGogettheKryptonite工作示例下

html - Bootstrap 布局中的 float div

我需要使用Boostrap做这样的事情。页面上的“流动”内容包含两个小部件-第一个在右上角,第二个在左下角。Widget1很简单——我只需要class="pull-right"。但是要如何处理第二个才能将其置于页面底部并保持“内容”float?style="bottom:0;"不起作用:有了这个代码...Widget1......Widget2.......alotofcontent....结果是这样的:向下移动Widget2也无济于事:...Widget1.......alotofcontent.......Widget2...关于如何在不进行肮脏的黑客攻击的情况下做到这一点的任何想

android - 三星 Galaxy 平板电脑不允许将 float 输入到 "number"类型的输入中

我们的客户希望我们为输入字段显示数字键盘,所以基本上我创建了一个如下字段:但是,GalaxyTablet会删除“.”并合并其前后的数字,还禁用“。”在键盘中。有没有其他方法可以解决此问题或在使用type="text"时在输入字段中显示数字键盘?注意:我尝试使用pattern属性(适用于iPhone)。我在装有Android2.1+的各种Android设备上测试了这个问题。我在任何其他HTC和三星设备上都没有遇到此错误。 最佳答案 是的,还有另一种方法。方式1:不使用type="number"而使用type="text"方法2:仅适用

html - 具有负边距的 float 元素会导致文本换行错误?

这看起来像是webkit中的文本换行错误,还是我遗漏了什么?DOM:noseatakimatasanctusestestestLorem...CSS:div{width:200px;}p{margin-right:32px;padding-left:30px;}img{float:left;margin-left:-30px;}演示:http://jsbin.com/onoced/1/edit截图: 最佳答案 正如您所指出的,我不会说这是一个错误:它在WebKit浏览器中的行为相同。否则我们必须将浏览器引擎之间的每一个差异都归类为错

html - 横向菜单 : how to float right but keep the menu items in the correct order?

我对水平菜单(.drop_menuli)使用float:right,因为我希望菜单与屏幕右侧对齐(Logo与左侧对齐)。它工作正常,唯一的问题是我的菜单项现在的顺序错误(链接3然后链接3然后链接1而不是相反)。有没有办法解决这个问题?非常感谢http://jsfiddle.net/eLSbq/LogoLink1SubLink1SubLink2Link2SubLink1SubLink2SubLink3SubLink4Link3SubLink1SubLink2SubLink3SubLink4.header{width:100%;background:#fff;color:#124191;f

html - 输入文本自动宽度填充 100%,其他元素 float

我的搜索框布局如下:PersonNameSearch​(为了展示目的,它非常简化)“范围”中的标题是长度可变的文本我想要的是让输入文本元素填充所有可用空间(即黄色空间),同时将搜索按钮保持在右侧。FullexamplewiththeCSSisinafiddle在IE7+、FF、Safari等...中实现解决方案的最简单方法是什么?谢谢! 最佳答案 像这样?演示:http://jsfiddle.net/v7YTT/19/HTML:SearchPersonName​CSS:#qsrxSearchbar{width:500px;heigh

html - 收缩包装/收缩以适应 div 以在 css 中回流 float div

http://jsfiddle.net/zEcn3/12/我正在尝试获取一个divcontent来调整大小以适应一行中的div的数量。因此,当窗口大于所有itemdiv的组合时,该示例工作正常,因此它们全部排成一排,但是当窗口调整得更小时,其中一个item重排到下一行,contentdiv的宽度为100%而不是收缩包装。我想要这个的原因是我可以让内容居中,内容上方有一个菜单栏,该菜单栏会缩小到合并后的重排内容的大小。HTML:Hello.Hello.Hello.Hello.Hello.CSS:.item{float:left;width:70px;border:1pxsolidblac

html - float 元素是否像定位元素一样创建单独的堆叠上下文?

最近我点亮了aninterestingarticleabouttheCSSz-indexproperty.我找到它是因为我正在寻找一个答案,说明为什么前一个div的溢出文本显示在后一个div的背景之上,但不显示在后一个div的跨度背景之上,就像这里(jsfiddle):#overflowed{background-color:green;width:300px;height:100px;}#non-floated{background-color:pink;width:300px;}#non-floatedspan{background-color:yellow;}对此的解释是浏览器以