13

tdと を除いて、要素内のテキストは中央揃えにする必要がSummaryありExperienceます。これは Firefox/chrome でのみ動作するようです。IE8 では、すべてのtdテキストが左揃えで表示されます。何をやってもセンターにならない。これが起こる特定の理由はありますか？

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;
}

テーブル

<?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：xamppを介してまったく同じコードを試したところ、IEの中央に配置されました。サーバー経由ではなく、ローカルマシンの XAMPP 経由で機能する理由は何ですか? （今ではかなり混乱しています）

編集2： jsfiddle

4

3 に答える 3

2

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

このコード行を先頭に追加すると、機能します。

于 2012-12-19T05:24:35.673 に答える
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">

これを追加すると、おそらく動作します

于 2012-12-19T05:34:10.327 に答える
-1

インライン CSS は、内部または外部の CSS を上書きします。<th style="width:x">列の幅を設定するために使用しました。使用中<th width="x">。

これはうまくいくはずです。

于 2012-12-19T08:00:49.240 に答える