CSS -align 3响应式分区 - 左侧位置固定，中心正常

我只是不能让那些左边的固定div响应。 3个div：| fixed | |中| |固定|这3个div是在一个div中。如果即将进入全尺寸窗口，他们正在完美地工作，但是当我缩小窗口的大小时，它将所有东西都拧紧。我不知道如何解决 - 我的中心div工作完美，响应和中心。但左侧和右侧固定不会有反应。我想解决方案是连接到固定div的响应宽度..任何想法？我增加JSFIDDLE例如用于您的方便：CSS -align 3响应式分区 - 左侧位置固定，中心正常

这是如下结构：

<div> 

<div **fixed** left>  <img>              </div> 
<div **normal** center>  2 divs for left and right inside the center div  </div> 
<div **fixed** right>                </div> 

</div>

REAL HTML：

<div id="div_header"> 
    <div class="cloumn right" id="div_right"><img src="http://placehold.it/250x600"></div> 
    <div class="cloumn center" id="div_center"> 
     <div id="inside_center"> 
      <div class="left_side" id="left_inside_center"> 


      </div> 
      <div class="right_side" id="right_inside_center"> 
       <h1> headline </h1> 
       <img src="http://img-9gag-lol.9cache.com/photo/a7KwPAr_460s.jpg"> 
      </div> 
     </div> 
     </div> 


    <div class="cloumn left" id="div_left"><img src="http://placehold.it/250x600"></div> 
</div> 
</div>

REAL CSS：

body { 
    margin-top: 0 !important; 
    direction: rtl; 
} 

#right_inside_center img { 
    width: 97%; 
    margin-top: 7px; 
} 
#left_inside_center { 
    float:left; 
    width:inherit; 
} 
#right_inside_center { 
    float:right; 
    width:65%; 
} 
#inside_center { 
    height: auto; 
    overflow: hidden; 

} 

#div_header { 
    text-align: center; 
    display: table; 
    width: 100%; 
    table-layout: fixed; 
} 
.cloumn { 
    display: table-cell; 
} 
.center { 
    background:green; 

    height: 1500px; 
    width: 60%; 
} 
.left { 

    position: fixed; 
    width: 18%; 
} 
.right { 

    position: fixed; 
    width: 18%; 
}

来源

2014-10-18 Roi Mulia

你可以让它更清楚你想要做什么？这里显然有很多的努力，但我无法弄清楚你想要的结果是什么。 – ArtOfCode 2014-10-18 16:10:09

我认为你正在寻找这个http://jsfiddle.net/victor_007/qwxoj8k2/2/ – 2014-10-18 16:25:43

@VitorinoFernandes OMG你是我的上帝！谢谢，你可以上传答案，让我可以upvote？ – 2014-10-18 17:32:31