Hello. The width of the
table 100%. s
td width and
max-width ‘than I gave.
table { border-collapse:collapse; border-spacing:0; border:0; }
td, th { padding:0; }
.table { max-width:100%; table-layout:fixed; background-color:#fff; border-bottom:1px solid #d8d9db; }
.table thead tr th { overflow:hidden; padding:0 10px; height:38px; text-align:left; background:#fff url('/admintema/images/table_bg.gif'); border:1px solid #d8d9db; }
.table tbody tr td { overflow:hidden; padding:6px 10px; text-align:left; border-left:1px solid #d8d9db; border-right:1px solid #d8d9db; }
<table cellpadding="0" cellspacing="0" class="table"> <thead> <tr> <th style="width:35px; max-width:35px;">No</th> <th style="width:17px; max-width:17px;"><span class="icon-camera icon-large"></span></th> <th style="width:418px; max-width:418px;">Ürün Adı</th> <th style="width:120px; max-width:120px;">Stok Kodu</th> <th style="width:120px; max-width:120px;">Fiyat</th> <th style="width:40px; max-width:40px;">Durum</th> <th style="width:60px; max-width:60px;">İşlem</th> </tr> </thead> <tbody> <tr> <td style="width:35px; max-width:35px;">86262</td> <td style="width:17px; max-width:17px;"><span id="foto-goster" class="icon-camera icon-large crs_pointer"></span></td> <td style="width:418px; max-width:418px;">Sony Xperia Z Beyaz Mükemme ve Olağan üstü bir telefon herkesin kullanması gerek</td> <td style="width:120px; max-width:120px;">TLSONYZergergergerregregerregergergrgegergeregergerergre</td> <td style="width:120px; max-width:120px;">1.400,00 TL</td> <td style="width:40px; max-width:40px; text-align:center;"><span style="color:#009900;" title="Aktif" class="crs_def tooltip icon-check-sign icon-large"></span></td> <td style="width:60px; max-width:60px; text-align:center;"> <a href="#" style="padding:4px; margin:0;" class="btn btn-mavi tooltip" title="Düzelt"><span class="icon-edit icon-large"></span></a> <a href="#" style="padding:4px; margin:0;" class="btn btn-kirmizi tooltip" title="Sil"><span class="icon-trash icon-large"></span></a> </td> </tr> </tbody> </table>
IE 8 and this results in other browsers except IE 9
IE 8 and
IE 9 also proplem
I guess you want to wrap the long text inside the td row . if that the case then apply the below css to your table.
word-break:break-all; word-wrap:break-word;
Complete Code:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> table { border-collapse: collapse; border-spacing: 0; border: 0; } td, th { padding: 0; } .table { max-width: 100%; table-layout: fixed; background-color: #fff; border-bottom: 1px solid #d8d9db; } .table thead tr th { overflow: hidden; padding: 0 10px; height: 38px; text-align: left; background: #fff url('/admintema/images/table_bg.gif'); border: 1px solid #d8d9db; } .table tbody tr td { overflow: hidden; padding: 6px 10px; text-align: left; border-left: 1px solid #d8d9db; border-right: 1px solid #d8d9db; word-break:break-all; word-wrap:break-word; } </style> </head> <body> <table cellpadding="0" cellspacing="0" class="table"> <thead> <tr> <th style="width: 35px; max-width: 35px;"> No </th> <th style="width: 17px; max-width: 17px;"> <span class="icon-camera icon-large"></span> </th> <th style="width: 418px; max-width: 418px;"> Ürün Adı </th> <th style="width: 120px; max-width: 120px;"> Stok Kodu </th> <th style="width: 120px; max-width: 120px;"> Fiyat </th> <th style="width: 40px; max-width: 40px;"> Durum </th> <th style="width: 60px; max-width: 60px;"> İşlem </th> </tr> </thead> <tbody> <tr> <td style="width: 35px; max-width: 35px;"> 86262 </td> <td style="width: 17px; max-width: 17px;"> <span id="foto-goster" class="icon-camera icon-large crs_pointer"></span> </td> <td style="width: 418px; max-width: 418px;"> Sony Xperia Z Beyaz Mükemme ve Olağan üstü bir telefon herkesin kullanması gerek </td> <td style="width: 120px; max-width: 120px;"> TLSONYZergergergerregregerregergergrgegergeregergerergre </td> <td style="width: 120px; max-width: 120px;"> 1.400,00 TL </td> <td style="width: 40px; max-width: 40px; text-align: center;"> <span style="color: #009900;" title="Aktif" class="crs_def tooltip icon-check-sign icon-large"> </span> </td> <td style="width: 60px; max-width: 60px; text-align: center;"> <a href="#" style="padding: 4px; margin: 0;" class="btn btn-mavi tooltip" title="Düzelt"> <span class="icon-edit icon-large"></span></a> <a href="#" style="padding: 4px; margin: 0;" class="btn btn-kirmizi tooltip" title="Sil"><span class="icon-trash icon-large"> </span></a> </td> </tr> </tbody> </table> </body> </html>
Thank you very much, your hand health
kortmazsefa
Thank you very much, your hand health
You are welcome and Glad to be of help.