2012-12-19 12 views
13

Tekst wewnątrz elementów td należy wyśrodkować, z wyjątkiem Summary i Experience. Wydaje się, że działa tylko w Firefox/chrome. W IE8 cały tekst td jest wyświetlany jako wyrównany do lewej. Bez względu na to, co próbuję, nie koncentruje się na tym. Jakiś konkretny powód, dlaczego tak się stało?Nie można wyśrodkować tekstu w IE, ale działa w firefox

CSS

#viewAll { 
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
    width: 100%; 
    border-collapse: collapse; 
    margin-left: 10px; 
    table-layout: fixed; 
} 

#viewAll td, #viewAll th { 
    font-size: 1.1em; 
    border: 1px solid #98bf21; 
    word-wrap: break-word; 
    text-align: center; 
    overflow: hidden; 
} 

#viewAll tbody td { 
    padding: 2px; 
} 


#viewAll th { 
    font-size: 1.1em; 
    padding-top: 5px; 
    padding-bottom: 4px; 
    background-color: #A7C942; 
    color: #ffffff; 
} 

stół

<?php 
echo '<table id="viewAll" class="tablesorter">'; 

      echo '<thead>'; 
      echo '<tr align="center">'; 
      echo '<th style="width:70px;">Product</th>'; 
      echo '<th style="width:105px;">Prob</th>'; 
      echo '<th style="width:105px;">I</th>'; 
      echo '<th style="width:60px;">Status</th>'; 
      echo '<th style="width:120px;">Experience</th>'; 
      echo '<th style="width:200px;">Technical Summary</th>'; 
      echo '<th style="width:80px;">Record Created</th>'; 
      echo '<th style="width:80px;">Record Updated</th>'; 
      echo '<th style="width:50px;">Open</th>'; 

      echo '</tr>'; 
      echo '</thead>'; 
      echo '<tbody>'; 

      while ($data=mysqli_fetch_array($result)){ 

      #limiting the summary text displayed in the table 
      $limited_summary = (strlen($data['summary']) > 300) ? substr(($data['summary']),0,300) . '...' : $data['summary']; 
      $limited_exp = (strlen($data['exp']) > 300) ? substr(($data['exp']),0,300) . '...' : $data['exp']; 

      echo '<tr align="center"> 

      <td style="width:70px; text-align:center;">'.$data['product'].'</td>'; 

      //if value is '-' do not display as link 
      if ($data['prob'] != '-'){ 

      echo '<td style="width:105px;">'.$data['prob'].'</a></td>'; 
      } 
      else{ 
        echo '<td style="width:105px; ">'.$data['prob'].'</td>'; 
      } 

      if ($data['i'] != '-'){ 

       echo '<td style="width:105px; ">'.$data['i'].'</a></td>'; 
      } 
      else{ 
        echo '<td style="width:105px; ">'.$data['i'].'</td>'; 
      } 

      echo'<td style="width:40px; " >'.$data['status'].'</td> 
      <td style="width:120px; text-align:left;">'.$limited_cust_exp.'</td> 
      <td style="width:200px; text-align:left;">'.$limited_summary.'</td> 
      <td style="width:80px; ">'.$data['created'].'</td> 
      <td style="width:80px; ">'.$data['updated'].'</td>'; 


      if (isset($_SESSION['username'])){ 
      echo '<td style="width:50px; "> <form action="displayRecord.php" method="get">'.' 
       <input type="hidden" name="id" value="'. $data['id'].'" style="text-decoration: none" /><input type="submit" value="Open" /></form></td>'; 
      }else{ 

       echo '<td style="width:50px; "> <form action="displayRecord.php" method="get">'.' 
       <input type="hidden" name="id" value="'. $data['id'].'" style="text-decoration: none" /><input type="submit" value="View" /></form></td>'; 

      } 


      echo '</tr>'; 

       }#end of while 

echo '</tbody>'; 
echo '</table>';    

?> 

EDIT 1: Ja tylko starałem się dokładnie ten sam kod za pośrednictwem XAMPP i centrów IT w IE. Czy jest jakiś pomysł, dlaczego miałby działać przez XAMPP na moim lokalnym komputerze, ale nie za pośrednictwem serwera? (Uzyskiwanie całkiem zdezorientowany to teraz)

EDIT 2: jsfiddle

+2

Czy możesz wstawić wygenerowany HTML zamiast PHP, który go tworzy? Najlepiej na jsfiddle lub podobnej usłudze, żebyśmy mogli to zobaczyć, zamiast się domyślić? – Amadan

+0

@Amadan: Tak, widzę, jak to pomoże. Dane są trochę wrażliwe, więc dodam kilka przykładowych danych i będę je miał na jsfiddle. Zrobię to jak najszybciej. – greenpool

+0

Twój kod wygląda na to, że powinien działać. Czy mógłbyś opublikować tutaj testową wygenerowanego kodu HTML (bez PHP) i podać nam link? http://jsfiddle.net/ –

Odpowiedz

2

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Dodaj ten wiersz kodu na górze, to będzie działać.

+0

Nie działa. Nie sądziłem, że tak. Chcesz wyjaśnić, dlaczego uważasz, że to zadziała? – greenpool

+1

@greenpool "DOCTYPE" jest niezwykle ważne szczególnie dla IE - informuje przeglądarkę, w jaki sposób powinna zinterpretować twoją stronę (tj. Czym ona jest). Przy okazji Twój komentarz sprawia, że ​​brzmisz wyjątkowo arogancko i prawdopodobnie znacznie zmniejszysz liczbę osób chętnych do pomocy. – Marty

+0

@MartyWallace: Nie chciałem brzmieć arogancko. Wiem, co robi i mam zadeklarowany w moim pliku nagłówkowym doctype html5 '. Sądzę, że to coś, o czym powinienem był wspomnieć. – greenpool

0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 

"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 

Dodaj to i to działa prawdopodobnie

+0

Prawdopodobnie działa? Zgadujesz? –

+0

@Ian Tylko sposób powiedzenia ... –

+0

Ugh, przepraszam. Już wcześniej miałem poważny problem z ostrymi przypadkami SO. Odpowiedź całkowicie rozsądna została znacznie skrócona bez komentarza co do tego, dlaczego ... –

-1

Inline CSS nadpisuje css wewnętrznego lub zewnętrznego. Użyłeś <th style="width:x">, aby ustawić szerokość kolumn. Zastosowane użycie: <th width="x">.

To powinno zadziałać.

+0

Obie są takie same rzecz. –

Powiązane problemy