<div id="ana_div"> <div class="div" id="div"><table id="personel"> <tr> <th>Sıra</th> <th>Ad</th> <th>Soyad</th> <th>Yaş</th> </tr> <tr> <td>1</td> <td>Asuman</td> <td>Göldağ</td> <td>29</td> </tr> <tr> <td>2</td> <td>Ünlüsoy</td> <td>Mansur</td> <td>49</td> </tr> <tr> <td>3</td> <td>Cansen</td> <td>Karaburun</td> <td>84</td> </tr> <tr> <td>4</td> <td>Ülküsel</td> <td>Özkahraman</td> <td>73</td> </tr> <tr> <td>5</td> <td>Funda</td> <td>Sığırcı</td> <td>38</td> </tr> <tr> <td>6</td> <td>Edibe</td> <td>Farımaz</td> <td>89</td> </tr> <tr> <td>7</td> <td>Uluer</td> <td>Akgül</td> <td>38</td> </tr> <tr> <td>8</td> <td>Tarımer</td> <td>Zımba</td> <td>60</td> </tr> <tr> <td>9</td> <td>Şule</td> <td>Alaca</td> <td>66</td> </tr> <tr> <td>10</td> <td>Hafız</td> <td>Bayduz</td> <td>38</td> </tr> </table> </div> <div class="div" id="div2"><table id="personel"> <tr> <th>Sıra</th> <th>Ad</th> <th>Soyad</th> <th>Yaş</th> </tr> <tr> <td>1</td> <td>Asuman</td> <td>Göldağ</td> <td>29</td> </tr> <tr> <td>2</td> <td>Ünlüsoy</td> <td>Mansur</td> <td>49</td> </tr> <tr> <td>3</td> <td>Cansen</td> <td>Karaburun</td> <td>84</td> </tr> <tr> <td>4</td> <td>Ülküsel</td> <td>Özkahraman</td> <td>73</td> </tr> <tr> <td>5</td> <td>Funda</td> <td>Sığırcı</td> <td>38</td> </tr> <tr> <td>6</td> <td>Edibe</td> <td>Farımaz</td> <td>89</td> </tr> <tr> <td>7</td> <td>Uluer</td> <td>Akgül</td> <td>38</td> </tr> <tr> <td>8</td> <td>Tarımer</td> <td>Zımba</td> <td>60</td> </tr> <tr> <td>9</td> <td>Şule</td> <td>Alaca</td> <td>66</td> </tr> <tr> <td>10</td> <td>Hafız</td> <td>Bayduz</td> <td>38</td> </tr> </table> </div> <div class="div" id="div3"><table id="personel"> <tr> <th>Sıra</th> <th>Ad</th> <th>Soyad</th> <th>Yaş</th> </tr> <tr> <td>1</td> <td>Asuman</td> <td>Göldağ</td> <td>29</td> </tr> <tr> <td>2</td> <td>Ünlüsoy</td> <td>Mansur</td> <td>49</td> </tr> <tr> <td>3</td> <td>Cansen</td> <td>Karaburun</td> <td>84</td> </tr> <tr> <td>4</td> <td>Ülküsel</td> <td>Özkahraman</td> <td>73</td> </tr> <tr> <td>5</td> <td>Funda</td> <td>Sığırcı</td> <td>38</td> </tr> <tr> <td>6</td> <td>Edibe</td> <td>Farımaz</td> <td>89</td> </tr> <tr> <td>7</td> <td>Uluer</td> <td>Akgül</td> <td>38</td> </tr> <tr> <td>8</td> <td>Tarımer</td> <td>Zımba</td> <td>60</td> </tr> <tr> <td>9</td> <td>Şule</td> <td>Alaca</td> <td>66</td> </tr> <tr> <td>10</td> <td>Hafız</td> <td>Bayduz</td> <td>38</td> </tr> </table> </div> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <div class="div" id="div4"><table id="personel"> <tr> <th>Sıra</th> <th>Ad</th> <th>Soyad</th> <th>Yaş</th> </tr> <tr> <td>1</td> <td>Asuman</td> <td>Göldağ</td> <td>29</td> </tr> <tr> <td>2</td> <td>Ünlüsoy</td> <td>Mansur</td> <td>49</td> </tr> <tr> <td>3</td> <td>Cansen</td> <td>Karaburun</td> <td>84</td> </tr> <tr> <td>4</td> <td>Ülküsel</td> <td>Özkahraman</td> <td>73</td> </tr> <tr> <td>5</td> <td>Funda</td> <td>Sığırcı</td> <td>38</td> </tr> <tr> <td>6</td> <td>Edibe</td> <td>Farımaz</td> <td>89</td> </tr> <tr> <td>7</td> <td>Uluer</td> <td>Akgül</td> <td>38</td> </tr> <tr> <td>8</td> <td>Tarımer</td> <td>Zımba</td> <td>60</td> </tr> <tr> <td>9</td> <td>Şule</td> <td>Alaca</td> <td>66</td> </tr> <tr> <td>10</td> <td>Hafız</td> <td>Bayduz</td> <td>38</td> </tr> </table> </div> <div class="div" id="div5"><table id="personel"> <tr> <th>Sıra</th> <th>Ad</th> <th>Soyad</th> <th>Yaş</th> </tr> <tr> <td>1</td> <td>Asuman</td> <td>Göldağ</td> <td>29</td> </tr> <tr> <td>2</td> <td>Ünlüsoy</td> <td>Mansur</td> <td>49</td> </tr> <tr> <td>3</td> <td>Cansen</td> <td>Karaburun</td> <td>84</td> </tr> <tr> <td>4</td> <td>Ülküsel</td> <td>Özkahraman</td> <td>73</td> </tr> <tr> <td>5</td> <td>Funda</td> <td>Sığırcı</td> <td>38</td> </tr> <tr> <td>6</td> <td>Edibe</td> <td>Farımaz</td> <td>89</td> </tr> <tr> <td>7</td> <td>Uluer</td> <td>Akgül</td> <td>38</td> </tr> <tr> <td>8</td> <td>Tarımer</td> <td>Zımba</td> <td>60</td> </tr> <tr> <td>9</td> <td>Şule</td> <td>Alaca</td> <td>66</td> </tr> <tr> <td>10</td> <td>Hafız</td> <td>Bayduz</td> <td>38</td> </tr> </table> </div> <div class="div" id="div6"><table id="personel"> <tr> <th>Sıra</th> <th>Ad</th> <th>Soyad</th> <th>Yaş</th> </tr> <tr> <td>1</td> <td>Asuman</td> <td>Göldağ</td> <td>29</td> </tr> <tr> <td>2</td> <td>Ünlüsoy</td> <td>Mansur</td> <td>49</td> </tr> <tr> <td>3</td> <td>Cansen</td> <td>Karaburun</td> <td>84</td> </tr> <tr> <td>4</td> <td>Ülküsel</td> <td>Özkahraman</td> <td>73</td> </tr> <tr> <td>5</td> <td>Funda</td> <td>Sığırcı</td> <td>38</td> </tr> <tr> <td>6</td> <td>Edibe</td> <td>Farımaz</td> <td>89</td> </tr> <tr> <td>7</td> <td>Uluer</td> <td>Akgül</td> <td>38</td> </tr> <tr> <td>8</td> <td>Tarımer</td> <td>Zımba</td> <td>60</td> </tr> <tr> <td>9</td> <td>Şule</td> <td>Alaca</td> <td>66</td> </tr> <tr> <td>10</td> <td>Hafız</td> <td>Bayduz</td> <td>38</td> </tr> </table> </div> </div>
böyle bir table ım var CSS ide aşağıdaki gibidir.
#personel td, #personel th {
border: 1px solid #e87b00;
padding: 8px;
font-weight:bold;
}
#personel tr:nth-child(even){background-color: #f2f2f2;}
#personel tr:hover {
background-color: #2ecc71;
color:#fff;
}
#personel th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #2c3e50;
color: white;
}
#ana_div {
height: 1500px;
width: 960px;
margin-right: auto;
margin-left: auto;
background-color: #FFF;
}
.div {
float: left;
display: inline-block;
height: 200px;
width: 300px;
margin: 10px;
color: #e87b00;
}Yukarıdaki table responsive yapmam için ne yapmam gerekiyor. Şimdiden yardımcı olan arkadaşlara teşekkürler
