我有通過DIV問題寬度

Question

表創建沒有覆蓋所有的div一個表，但是我給的寬度在100％表的

$("#astana").click(function(){ 
 
\t \t \t $(".t2").toggle(500); 
 
\t \t });

/*---tables---*/ 
 
.wrapper { 
 
    margin: 0 auto; 
 
    max-width: 800px; 
 
} 
 

 
.table { 
 
    margin: 0 0 40px 0; 
 
    width: 100%; 
 
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); 
 
    display: table; 
 
} 
 

 
.row { 
 
    display: table-row; 
 
    background: #f6f6f6; 
 
} 
 
.row:nth-of-type(odd) { 
 
    background: #e9e9e9; 
 
} 
 
.row.header { 
 
    font-weight: 900; 
 
    color: #ffffff; 
 
    background: #ea6153; 
 
} 
 
.row.green { 
 
    background: #27ae60; 
 
} 
 
.row.blue { 
 
    background: #2980b9; 
 
} 
 

 

 
.cell { 
 
    padding: 6px 12px; 
 
    display: table-cell; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="wrapper"> 
 
<div class="table"> 
 
<div class="row header"> 
 
<div class="cell" id="astana">Астана</div> 
 
</div> 
 
<div class="t2"> 
 
<div class="row header blue"> 
 
<div class="cell">№</div> 
 
<div class="cell">Ресторан</div> 
 
<div class="cell">Адрес</div> 
 
<div class="cell">Тел. доставки</div> 
 
<div class="cell">Часы доставки:</div> 
 
</div> 
 
<div class="row"> 
 
<div class="cell">1</div> 
 
<div class="cell">ТРЦ «КЕРУЕН»</div> 
 
<div class="cell">улица Достык, 9</div> 
 
<div class="cell"></div> 
 
<div class="cell"></div> 
 
</div> 
 
<div class="row"> 
 
<div class="cell">2</div> 
 
<div class="cell">ХАН ШАТЫР</div> 
 
<div class="cell">пр. Туран, 37</div> 
 
<div class="cell"></div> 
 
<div class="cell"></div> 
 
</div> 
 
<div class="row"> 
 
<div class="cell">3</div> 
 
<div class="cell">КОНГРЕСС-ХОЛЛ</div> 
 
<div class="cell">Бейбитшилик 9<br> 
 
Правый берег</div> 
 
<div class="cell">+7(717)273-81-37<br> 
 
+7(777)148-26-34</div> 
 
<div class="cell">10:00-23:00<br> 
 
без выходных</div> 
 
</div> 
 
<div class="row"> 
 
<div class="cell">4</div> 
 
<div class="cell">«MEGA ASTANA»</div> 
 
<div class="cell">Коргальджинское шоссе, 1<br> 
 
Левый берег</div> 
 
<div class="cell">+7(717)279-14-69<br> 
 
+7(705)308-54-31</div> 
 
<div class="cell">10:00-23:00<br> 
 
без выходных</div> 
 
</div> 
 
<div class="row"> 
 
<div class="cell">5</div> 
 
<div class="cell">РЕСПУБЛИКА</div> 
 
<div class="cell">пр. Республики 8</div> 
 
<div class="cell"></div> 
 
<div class="cell"></div> 
 
</div> 
 
<div class="row"> 
 
<div class="cell">6</div> 
 
<div class="cell">УНИВЕРСИТЕТ</div> 
 
<div class="cell">ул. Пушкина уг.ул. Мирзояна</div> 
 
<div class="cell"></div> 
 
<div class="cell"></div> 
 
</div> 
 
<div class="row"> 
 
<div class="cell">7</div> 
 
<div class="cell">Парк Арай</div> 
 
<div class="cell">Сарайшык</div> 
 
<div class="cell"></div> 
 
<div class="cell"></div> 
 
</div> 
 
</div> 
 
</div> 
 
</div>

CSS。

該表並未涵蓋我所有的div元素。在下面的截圖中，你看到了。 http://i59.tinypic.com/24njw2e.png 我給你的CSS，HTML。我解決不了

Answer 1

您的表格未擴展到100％寬度的原因是因爲您的div設置爲表格行，但您沒有表格容器。將display:table和width:100%添加到.t2將解決此問題。 jsfiddle