CSS：将“float：right”元素移到顶部（与列表的第一个元素对齐）

我有一系列元素，最后一个元素有css“float：left”。CSS：将“float：right”元素移到顶部（与列表的第一个元素对齐）

我想显示它在第一个元素的相同高度，而不是在列表的底部。（我不能更改html代码，所以它是列表中的最后一个）。

与此同时，我想保持在正确的位置。我怎样才能让它最好的CSS？

感谢

代码：

<div class="field field-type-text field-field-year"> 
    <div class="field-items"> 
      <div class="field-item odd"> 
         <div class="field-label-inline-first"> 
       Year:&nbsp;</div> 
        2009  </div> 
     </div> 
</div> 
<div class="field field-type-text field-field-where"> 
    <div class="field-items"> 
      <div class="field-item odd"> 
         <div class="field-label-inline-first"> 
       Where:&nbsp;</div> 
        Musée Rath, Geneva  </div> 
     </div> 
</div> 
<div class="field field-type-text field-field-when"> 
    <div class="field-items"> 
      <div class="field-item odd"> 
         <div class="field-label-inline-first"> 
       When:&nbsp;</div> 
        25.8 – 27.9.2009  </div> 
     </div> 
</div> 
<div class="field field-type-text field-field-editor"> 
    <div class="field-items"> 
      <div class="field-item odd"> 
         <div class="field-label-inline-first"> 
       Editor:&nbsp;</div> 
        Blabla Blabla  </div> 
     </div> 
</div> 
<div class="field field-type-text field-field-material"> 
    <div class="field-items"> 
      <div class="field-item odd"> 
         <div class="field-label-inline-first"> 
       Material/techniques:&nbsp;</div> 
        contemporary art installations  </div> 
     </div> 
</div> 
<div class="field field-type-text field-field-dimension"> 
    <div class="field-items"> 
      <div class="field-item odd"> 
         <div class="field-label-inline-first"> 
       Dimension:&nbsp;</div> 
        2 floors in a neoclassical building  </div> 
     </div> 
</div> 
<div class="field field-type-text field-field-artists"> 
    <div class="field-items"> 
      <div class="field-item odd"> 
         <div class="field-label-inline-first"> 
       Artists:&nbsp;</div> 
        Blablablabla balbalbalbalba 
     </div> 
     </div> 
</div> 


    .field-field-year, .field-field-where, .field-field-when, .field-field-editor, .field-field-material, .field-field-dimension { 
     width:300px; 
    } 



    .field-field-artists { 

     width:400px; 
     float:right; 
     clear:right; 
     top-margin: -200px; 
    }

来源

2010-04-23 aneuryzm

你可以发布一些源代码吗？ – Kyle 2010-04-23 11:06:21

需要这个源代码来解决问题 – 2010-04-23 11:08:13

我已经添加了代码 – aneuryzm 2010-04-23 12:01:19

你有一个小错误，使其：

.field-field-artists { 

     width:400px; 
     float:right; 
     clear:right; 
     margin-top: -200px; 
    }

来源

2010-04-23 12:44:55

该死的，好的谢谢。我有2个问题：1）它是一个很好的解决方案为IE浏览器？ 2）如果以前的字段内容发生变化，高度变化和上边距需要更新，对吗？所以......还有其他解决方案吗？ – aneuryzm 2010-04-23 12:54:24

是的，如果尺寸改变，它会改变。为了做到这一点（动态），你需要一些JavaScript我想。另一种选择是将其他人放入一个div中，并将该组右侧的最后一个浮动 - 但这改变了结构（如果你控制的话，我会考虑改变结构） – 2010-04-23 13:31:04

您可以在最后一个字段的权利和其他漂浮到左边（假设有足够的水平空间）或使用绝对定位或使用JavaScript重新排序块;但由于这显然是Drupal，你不能只重新配置字段权重吗？

来源

2010-04-23 13:10:56 Tgr

CSS：将“float：right”元素移到顶部（与列表的第一个元素对齐）

回答

相关问题