Czy możliwe jest wykonanie dowolnej liczby kolumn, które mają taką samą szerokość w elastycznym kontenerze szerokości z czystym CSS?
Przykład:
<div>
<div>COL-1</div>
...
<div>COL-N</div>
</div>
Zewnętrzny div ma elastyczną szerokość, liczba kolumn jest różna. Szerokość kolumny powinna być taka sama, niezależnie od szerokości zawartości kolumn.
Odpowiedzi:
1 dla odpowiedzi № 1próbować display:table
dla zewnętrznego div i display:table-cell
dla wewnętrznego div
<div id="outer">
<div>COL-1</div>
<div>COL-N</div>
<div>cvcvffff</div>
</div>
/>
#outer{
display:table;
width:720px;
table-layout: fixed;
}
#outer>div{
display:table-cell;
border:1px solid black;
}
-2 dla odpowiedzi nr 2
Tak, to możliwe, aby to zrobić.
Jeśli używasz PHP w swoim kodzie, wykonaj następujące czynności, aby wygenerować następujące elementy <div>
<html>
<style>
div{
width:100px;
}
</style>
<body>
<?php
for ($i = 0; $i < 100; $i++)
echo "<div>COL-$i</div>";
?>
</body>
</html>