将div元素对齐到右侧并重叠

<div style="border: 1px solid">Hello</div> 
<div style="float: right;border: 1px solid;width: 30%">Centre</div> 
<div style="border: 1px solid">World</div>

我想将第二个div对齐到右侧，因为它只有30％的宽度。但是，当我使用float时，第三个div与第二个div重叠。我如何确保3rd div在第一格之后不是第二格之后才会出现。文本对齐无济于事，因为我希望整个div在正确的方面不仅仅是它的内容。将div元素对齐到右侧并重叠

请建议。

来源

2012-02-27 SoulMan

你有没有试过清：both;在第三个div？这消除了之前一切的浮动。 – 2012-02-27 09:31:21

你想要第三个Div在哪里？ – Starx 2012-02-27 09:38:42

它工作！但我不明白，如果它删除浮动，为什么我必须使用浮动。有没有办法将div与右边对齐而不会浮动？也希望清楚：两者都不会影响页面中的其他任何浮动内容？ – SoulMan 2012-02-27 09:46:01

此代码在Dreamweaver中适用于我，但出于某种原因不适用于jsfiddle？如果你知道原因，请留下评论。

http://jsfiddle.net/WAWN2/

<div style="border: 1px solid; width:100%">Hello</div> 
<div style="float: right;border: 1px solid; width:30%; display:block;">Centre</div> 
<div style="border: 1px solid; width:100%">World</div>

而且，这里是使用透明的例子：两个

http://jsfiddle.net/NyFGB/

来源

2012-02-27 09:51:11 Undefined

抱歉以上代码在firefox，chrome，safari中无法使用 – SoulMan 2012-02-28 04:02:53

移动的第二个div上面HTML中的第一个，以获得的布局你想要的方式它：

<div style="float: right;border: 1px solid;width: 30%">Centre</div> 
 
<div style="border: 1px solid">Hello</div> 
 
<div style="border: 1px solid">World</div>

来源

2016-04-25 10:31:22

将div元素对齐到右侧并重叠

回答

相关问题