製作div寬度響應

Question

我想讓幾個'塊'的文字從這裏去：

| 1 | | 2 | | 3 | | 4 | | 5 | | 6 |

當除了平板寬的屏幕上觀看，以根據屏幕尺寸較小響應，這樣的：

在片劑：

| 1 | | 2 | | 3 |

| 4 | | 5 | | 6 |

在手機上：

| 1 |

| 2 |

| 3 |

| 4 |

| 5 |

| 6 |

當所有6個塊在一行中時的全寬是980px。所以每個div都是這個寬度的1/6（​​大約163px）。我還希望每個div都根據所查看的屏幕大小有一個響應寬度，並在屏幕上居中顯示。

到目前爲止，我使用的是float：left，但所有這些都是在較小的屏幕上查看時將塊保留在屏幕的左側，而在塊的右側留下很大的間隙，這不是我想。我希望塊被集中。

我正在使用DIV創建塊，但不確定這是否是最好的方法？下面是我使用ATM代碼：

#block { 
width: 163.33px; 
float: left; 
padding: 0px;   
} 

如果任何人對我怎麼能做到這一點任何想法，那將是巨大的:-)

Answer 1

試試這個CSS

#block { 
width: 163.33px; 
display:inline-clock; 
padding: 0px;   
} 

#block母塊

{ 
text-align-center; 
} 

Answer 2

如果我可以共享一個想法，你可以做到這一點通過限制的文本塊成一個單一的埃爾EMENT。例如：

|A| = ||1| |2| |3| |4| |5| |6|| 

當你的HTML響應，它會自動顯示|A|爲您提到的意志。如何使你的HTML響應可以被讀取here。