Как центрировать по scrollWidth вместо containerWidth?

Question

[serioer]

Привет у меня есть

<div class="container">
    <div class="menu"></div>
    <div class="tab"></div>
  </div>
<style>
.container{
  width:100%;
  height:100%;
  border:3px solid red;
  overflow: auto;
}
.menu{
  width:500px;
  height:50px;
  background:green;
  margin:auto;
}
.tab{
  width: 1000px;
  background: yellow;
  height: 200px;
}
</style>

зеленый кубик центируется по шиирине контейнера родителя, однако желтая полоска может быть шире контейнера и занимать scrollWidth
как центрировать по всему scrollwidth а не просто containerWidth
что б при прокрутке елемент был в центе прокручиваемого елемента а не в центре видимой области

Answer 1

[Сергей delphinpro]

<div class="container">
  <div>
    <div class="menu"></div>
    <div class="tab"></div>
  </div>
</div>