（CSS）将div元素从中心向左对齐

Question

我试图将一个div元素居中，让其他人像他一样向左浮动：

在此代码中，宽度和高度设置为px，但在我的％中。所以我不知道中心在哪里。所以它必须以不同的分辨率改变。 我不想把它放在另一个div中心，因为它将两个div都居中，我只希望黄色位于中心。

除了在左侧放置另一个与绿色相同的高度并且让他看不见的空div之外，还有其他解决办法吗？

＆＃13;

＆＃13;

.container{
    background-color:#34495e;
    width: 500px;
    height: 200px;
    padding: 10px;
}

.in-center{
    background-color:#f1c40f;
    width: 40%;
    height: 100%;
    display: inline-block;
}

.to-left{
    background-color:#2ecc71;
    width: 20%;
    height: 100%;
    display: inline-block;
}

＆＃13;

<div class="container">
        <div class="in-center"></div>
        <div class="to-left"></div>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.container {
  background-color: #34495e;
  width: 80%;
  height: 200px;
  text-align: center;
  position: relative;
}
.in-center {
  background-color: #f1c40f;
  width: 40%;
  height: 100%;
  display: inline-block;
}
.to-left {
  background-color: #2ecc71;
  width: 20%;
  height: 100%;
  display: inline-block;
  position: absolute;
}

<div class="container">
  <div class="in-center"></div>
  <div class="to-left"></div>
</div>