如何用CSS包装div周围的div

时间:2011-11-07 16:23:00

标签: css

考虑到下面的一些代码,有人可以告诉我如何在顶部右上角对齐content-meta-wrapper div内的content,然后将内容放在content div内像图像一样环绕它?下图中的粉红色高亮显示为content-meta-wrapper div。

<div id="content">
  all the content you see except the Half BOX in the right hand side


  <div id="content-meta-wrapper">
     <div id="content-meta>
       The right that is aligned at the TOP RIGHT of the content diva
     <div>
  <div>

</div>

我不能只从图像中查看来源的原因是因为图像来自我的网站现在如何在Photoshop中移动一些东西。

2 个答案:

答案 0 :(得分:4)

假设它已在内容<div>内标记,您只需将float: right;传递给它,它应该可以解决问题。

我在 This Example 中使用的代码如下:

#container { /* Pure Looks */
    margin: 5px;
    padding: 5px;
    border: 1px solid black;
}
#floated {
    height: 100px;
    width: 100px;
    float: right; /* This is what counts!! */
    background: red;
}

请参阅 Awesome Article about Floats - by Chris Coyer of css-tricks.com

答案 1 :(得分:1)

你应该使用css规则,

  

浮动:左;

     

浮动:右;

这些会使你的div在正确的位置对齐,以保持整洁,确保你的div宽度。