fotorama - Fotorama 画廊不起作用宽度：块显示表格单元中的 100 %

Question

如果我把画廊的代码显示：table-cell 块，画廊在减少父块的宽度后不会更新它的宽度。

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

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

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