Fotorama gallary没有工作宽度：块显示表格单元格中的100％

Question

如果我将图库的代码显示为：table-cell block，则在减小父块的宽度后，图库不会更新其宽度。

HTML：

<div class="page">
   <div class="sidebar">
       Sidebar
   </div>
   <div class="mainbar">
       Mainbar
       <div class="fotorama" data-width="100%" data-ratio="3/2">
           <a href="1.jpg"></a>
           <a href="2.jpg"></a>
           <a href="3.jpg"></a>
           <a href="4.jpg"></a>
           <a href="5.jpg"></a>
      </div>        

    </div>
</div>

CSS：

.page {
    display: table;
    width: 100%;
    }
    .sidebar,
    .mainbar {
        padding: 10px;
        display: table-cell;
        }
    .sidebar {
        width: 30%;
        background: #BEF781;
        }
    .mainbar {
        background: #F3F781;
        width: 70%;
        }

示例：http://jsfiddle.net/o3cjqeau/6/

Answer 1

我遇到了同样的问题，添加＆＃34; table-layout：fixed;＆＃34;为我工作：

.page {
display: table;
table-layout: fixed;
width: 100%;
}