包含突出显示单元格的表格


Table with highlighted cells

我正在尝试使用WordPress制作博客,但我偶然发现了一个错误。我的页面水平显示页面,预览文本很糟糕。我该如何解决这个问题?这是我索引的一个片段.php :

<?php get_header(); ?>
    <div id="wrapper">
        <table class="centerTable">
            <tr>
                <?php $the_query = new WP_Query( 'posts_per_page=5' ); ?>
                <?php while ($the_query -> have_posts()) : $the_query -> the_post(); ?>
                    <th><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></th>
                    <th><?php the_excerpt(__('(more…)')); ?></th>
                <?php endwhile;  wp_reset_postdata();?>
            </tr>
        </table>
    </div>
<?php get_footer(); ?>

这就是风格.css :

.centerTable {
margin-left: auto ;
margin-right: auto ;
background-color: white;
-webkit-border-radius:10px;
-moz-border-radius:10px;
position: center;
width: 550px;
font-family: 'Shift', sans-serif;
}
.centerTable tr, th, td {
color: #444;
font-size: 16px;
font-family: 'Shift', sans-serif;
transition: .4s background-color;}
.centerTable th, tr {
padding:3px 6px; font-weight:normal; 
color:#000;
}
.centerTable th:hover {
background-color: #ffa500;
color: white;
}

你能帮帮我吗?我希望我的页面和预览文本一个接一个(就像一个有 2 列和多行的表格)。

为什么不给"table"和"tr"一个最大宽度大小,并像CSS盒子模型那样工作呢?