2012-12-19 4 views
13

Il testo all'interno degli elementi td deve essere centrato ad eccezione di Summary e Experience. Sembra funzionare solo in Firefox/Chrome. In IE8 tutto il testo td viene visualizzato come giustificato a sinistra. Non importa quello che provo, non lo centra. Qualche ragione particolare per cui ciò accadrebbe?Impossibile centrare il testo in IE ma funziona in 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; 
} 

tavolo

<?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: Ho appena provato lo stesso codice esatto via XAMPP e centra in IE. Qualche idea sul perché funzionerebbe tramite XAMPP sul mio computer locale ma non tramite il server? (Ottenendo molto confuso da questo momento)

EDIT 2: jsfiddle

+2

Potresti postare l'effettivo HTML generato al posto di PHP che lo crea? Preferibilmente su jsfiddle o un servizio simile in modo che possiamo vederlo, piuttosto che indovinare su di esso? – Amadan

+0

@Amadan: sì, posso vedere come questo aiuterà. I dati sono un po 'sensibili, quindi aggiungerò alcuni dati di esempio e li avrò su jsfiddle. Lo farà al più presto. – greenpool

+0

Sembra che il tuo codice dovrebbe funzionare. Potresti pubblicare qui una testcase dell'HTML generato (senza PHP) e fornirci il link? http://jsfiddle.net/ –

risposta

2

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

aggiungi questa linea di codice nella parte superiore, che funzionerà.

+0

Non funziona. Non pensavo che sarebbe. Ti va di spiegare perché hai pensato che avrebbe funzionato? – greenpool

+1

@greenpool Un 'DOCTYPE' è estremamente importante specialmente per IE - dice al browser come dovrebbe interpretare la tua pagina (cioè che cos'è). A proposito, il tuo commento ti fa sembrare estremamente arrogante e probabilmente ridurrà di molto la quantità di persone disposte ad aiutarti. – Marty

+0

@MartyWallace: non volevo sembrare arrogante. So cosa fa e ho il doctype html5 '' dichiarato nel mio file di intestazione. Immagino che sia qualcosa che avrei dovuto menzionare. – 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"> 

Aggiungere questo e che avrebbe funzionato probabilmente

+0

Probabilmente lavoro? Stai indovinando? –

+0

@Ian Solo un modo per dire ... –

+0

Ugh, mi dispiace. Ho avuto un brutto caso di SO dura prima. Una risposta perfettamente ragionevole è stata marcata molto con zero commenti sul perché ... –

-1

Inline CSS sovrascrive il css interno o esterno. Hai utilizzato <th style="width:x"> per impostare la larghezza delle colonne. Utilizzo ist. <th width="x">.

Questo dovrebbe funzionare.

+0

Sono entrambi gli stessi cosa. –