Javascript HTML/CSS：如何使正确的浮动到达顶部，而不是在内联时浮动在它们所在的位置？

例如，在此页面上，您会看到3幅图像，它们位于带有红色边框的

.container

内，分别为

float:right

：

图像从中间开始，因为这是它们最初相对于左侧内容放置的位置

我怎样才能让他们在没有CSS的情况下一直走到顶端

编辑2011年11月8日下午4时06分：尝试调整浏览器的大小，使其越来越小，您将看到图像被内联放置。这是因为随着浏览器的缩小，float:right属性将被删除，以便图像与代码中的图像内联到同一位置。我不能简单地将

元素放在所有

元素之前，因为这样当您收缩浏览器时，图像将不再位于正确的位置

编辑2011年11月8日下午4:11pm:因此，基本上我希望这样，当窗口较小时，所有旁白都显示在正确的内联位置，但当浏览器窗口较大时，所有图像都应显示在右侧，就像它们出现在右侧的侧边栏中一样

这在CSS中是可能的吗

编辑2011年11月8日下午4:16:该网站应该是故意缩小的。尝试调整浏览器的大小，使其与iPhone或Android一样宽。

元素在其应该显示的位置内联显示。但是当浏览器在桌面上是全尺寸时，我希望

元素从顶部开始浮动到右侧

---

这是否可以通过CSS实现，或者我必须使用Javascript吗？

在主div中的所有p元素之前先放置一些元素

而不是：

<p>...</p>
<p>...</p>
<aside>...</aside>
<p>...</p>
<p>...</p>
<aside>...</aside>
<p>...</p>

更多信息。
在主div中的所有p元素之前先放置这些元素

而不是：

<p>...</p>
<p>...</p>
<aside>...</aside>
<p>...</p>
<p>...</p>
<aside>...</aside>
<p>...</p>



更多信息。
将
标记放在
主
分区中
标记的上方。
将
标记放在
主
分区中
标记的上方。
浮动
内联块

浮动
，
内联块

答案是我想要的东西没有Javascript是不可能的。
答案是我想要的东西没有Javascript是不可能的。
谢谢Shomz，但是试着把你的浏览器缩小一点，你就会明白为什么我不能这么做。@trusktr：你想让窗口缩小时的行为是什么？当窗口变小时，所有旁白都显示在正确的内联位置，但我希望这样，当浏览器窗口更大时，所有图像都显示在右侧，就好像它是右侧的边栏一样。宽度问题？尝试应用固定宽度。或者你可以把所有左边的元素放到一个单独的左浮动div中，把所有旁边的元素放到一个单独的右浮动div中。这对你有用吗？我希望网站故意缩小。。。因此，使用手机的人也可以有一个很好的体验。它应该这样做。检查一下：尝试调整浏览器的大小，使其与Android手机或iPhone一样宽。图像将在内容的正确位置内联。但是，当您使用完整的桌面版本时，我希望这些
都在右边，并且都从顶部开始。谢谢Shomz，但是尝试将浏览器的大小调整得更小，您就会明白为什么我不能这样做。@trusktr：那么，当窗口变小时，您希望这些行为是什么？当窗口变小时，所有旁白都显示在正确的内联位置，但我希望这样，当浏览器窗口更大时，所有图像都显示在右侧，就好像它是右侧的边栏一样。宽度问题？尝试应用固定宽度。或者你可以把所有左边的元素放到一个单独的左浮动div中，把所有旁边的元素放到一个单独的右浮动div中。这对你有用吗？我希望网站故意缩小。。。因此，使用手机的人也可以有一个很好的体验。它应该这样做。检查一下：尝试调整浏览器的大小，使其与Android手机或iPhone一样宽。图像将在内容的正确位置内联。但是，当您使用完整的桌面版本时，我希望这些
都是正确的，并且都是从顶部开始的。谢谢Charlie，但是请尝试将浏览器的大小调整得更小，您就会明白为什么我不能这样做。我编辑了我的问题。所以你希望图像在普通浏览器中位于侧边栏的顶部，但当它被调整到较小的宽度时，你希望它们位于当前位置？没错！这正是我想要的。我想也许有某种方法可以告诉
元素使用CSS进入顶部。Javascript总是有办法做到这一点，但我不太确定在这种情况下是否使用CSS。我想如果你应用CSS将其向上移动，屏幕最小化时也会是这样。谢谢Charlie，但是试着把你的浏览器缩小一点，你就会明白为什么我不能这么做。我编辑了我的问题。所以你希望图像在普通浏览器中位于侧边栏的顶部，但当它被调整到较小的宽度时，你希望它们位于当前位置？没错！这正是我想要的。我想也许有某种方法可以告诉
元素使用CSS进入顶部。使用Javascript总是有办法的，但我不太确定在这种情况下是否使用CSS。我想如果你应用CSS将其向上移动，当屏幕最小化时也是如此，只是一个思想浮点数在正确的垂直位置，并保持在文本的一侧。你要的东西听起来很像需要重新排序的东西。我不知道，我可能只是不够一个CSS魔术师
p, ul, ol, dl, blockquote {
    max-width: 40em; /* Optimal width for long-form text */
    float:left;
}

aside {
    display:inline-block;
    width: 18em;
    height:auto;
}