我曾多次使用float:右(或左)将图像和嵌入框浮动在容器顶部。现在，我需要浮动一个div到另一个div的右下角与正常的文本包装，你得到的浮动(文本包装上面和左边只有)。
我认为这一定是相对容易的，即使浮动没有底部值，但我还没有能够做到这一点使用一些技术和搜索网络还没有出现任何其他使用绝对定位，但这并没有给出正确的换行行为。
我原以为这是一种很常见的设计，但显然不是。如果没有人有建议，我将不得不把我的文本分解成单独的盒子，并手动对齐div，但这是相当不稳定的，我不想在每个需要它的页面上都这样做。
当前回答
如果你想要文本包装漂亮:-
.outer { 显示:表; ｝ 在{ 身高:200 px; 显示:表格单元; vertical-align:底部; ｝ /*仅用于样式*/ 在{ 背景:# eee; 填充:0 20px; ｝ <！——需要两个父元素——> < div class = "外" > < div class = "内部" > < h3 >标题< / h3 > 示例看< p > < / p > < / div > < / div >
其他回答
您可以尝试使用宽度为1px的空元素并将其浮动。然后清除您实际想要定位的元素，并使用空元素的高度来控制它向下移动的距离。
http://codepen.io/cssgrid/pen/KNYrey/
.invisible {
float: left;
}
.bottom {
float: left;
padding-right: 35px;
padding-top: 30px;
clear: left;
}
不确定，但之前发布的一个场景似乎可以工作，如果你在子div上使用position: relative而不是absolute。
#parent {
width: 780px;
height: 250px;
background: yellow;
border: solid 2px red;
}
#child {
position: relative;
height: 50px;
width: 780px;
top: 100%;
margin-top: -50px;
background: blue;
border: solid 2px green;
}
<div id="parent">
This has some text in it.
<div id="child">
This is just some text to show at the bottom of the page
</div>
</div>
而且没有桌子……!
在与各种技巧斗争了几天之后，我不得不说这似乎是不可能的。即使使用javascript(我不想这样做)，这似乎是不可能的。
To clarify for those who may not have understood - this is what I am looking for: in publishing it is quite common to layout an inset (picture, table, figure, etc.) so that its bottom lines up with the bottom of the last line of text of a block (or page) with text flowing around the inset in a natural manner above and to the right or left depending on which side of the page the inset is on. In html/css it is trivial to use the float style to line up the top of an inset with the top of a block but to my surprise it appears impossible to line up the bottom of the text and inset despite it being a common layout task.
我想我将不得不重新审视这个项目的设计目标，除非有人有最后的建议。
哦,年轻人…给你:
<div class="block">
<a href="#">Some Content with a very long description. Could be a Loren Ipsum or something like that.</a>
<span>
<span class="r-b">A right-bottom-block with some information</span>
</span>
<span class="clearfix"></span>
</div>
<style>
.block {
border: #000 solid 1px;
}
.r-b {
border: #f00 solid 1px;
background-color: fuchsia;
float: right;
width: 33%
}
.clearfix::after {
display: block;
clear: both;
content: "";
}
</style>
没有绝对的立场! 响应! 版的
简单……在HTML文件....将“footer”(或你想要在底部的div)放在底部。所以不要这样做:
<div id="container">
<div id="Header"></div>
<div id="Footer"></div>
<div id="Content"></div>
<div id="Sidebar"></div>
</div>
这样做:(把页脚放在下面。)
<div id="container">
<div id="Header"></div>
<div id="Content"></div>
<div id="Sidebar"></div>
<div id="Footer"></div>
</div>
这样做之后，你可以打开css文件，让“边栏”浮动到左边。然后将content浮动到右边，然后将footer清除。
这应该有用。对我来说是这样。
