Css 将一个div居中，而另一个div向右浮动？

以下是我的例子：

<div id="mainContainer">
     <div id="itemIWantToCenter"></div>
     <div id="itemIwantFloatedRight"></div>
</div>

---

mainContainerwidth

宽度设置为100%。

itemIwantFloatedRight

宽度设置为300px。假设

itemIWantToCenter

的宽度为200px。在容器中浮动另一个div时，如何将该div居中？谢谢

当然，您应该使用链接的样式表

<div id="mainContainer" style="width:100%; border:solid 1px red;">
  <div id="itemIwantFloatedRight" style="width:300px; border:solid 1px green; float:right">
     right
  </div>
  <div id="itemIWantToCenter" style="width:200px; border:solid 1px blue; margin:0 auto;">
     center
  </div>
</div>

正确的
居中

下面是我的解决方案的一个示例，代码如下（固定链接）

此解决方案的优点是，当父容器的大小更改时，内容容器将扩展，同时保留其边距，右侧边栏将始终保持在右侧

希望这有帮助

注意，在小提琴中，

内容

容器有点薄。这是由于窗口的大小。更改窗口的大小{将鼠标悬停在分隔符上，单击并拖动}，以查看其优点

<div class="container">
    <div class="content">
        centered content
    </div>
    <div class="right">
        right
    <div>
</div>

希望这有助于：

<div id="mainContainer">
    <div id="itemIWantToCenter" style="float: right;"></div>
    <div id="itemIwantFloatedRight" style="margin-left: 50%;"></div>
</div>

这只在少数情况下有效；取决于屏幕大小和中心容器大小。真的很好奇这是什么样的解决方案。在这种情况下，屏幕大小可以缩小到700px，然后中间和右边的div将重叠。因为大多数网站都比这更宽，所以这不应该是个问题。我只希望@DDiVita的情况可以：）

<div id="mainContainer">
    <div id="itemIWantToCenter" style="float: right;"></div>
    <div id="itemIwantFloatedRight" style="margin-left: 50%;"></div>
</div>