Таблица не центрирована должным образом в модуле

Моя таблица в моем модуле портфолио не центрируется правильно. В chrome это немного чересчур слева, когда в firefox это слишком много вправо. Есть идеи? Вот мой html-код для портфолио.

<p style="text-align: center;"> </p>
<table style="height: 265px; margin-left: auto; margin-right: auto;" width="1013">
<tbody>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td style="text-align: center;">
<p><img src="images/quest_design_web_gallery_header.png" alt="" /></p>
<p> </p>
</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td><a href="img/image-1.jpg" data-lightbox="web" data-title="This is first image caption"><img style="display: block; margin-left: auto; margin-right: auto;" src="images/thumbnail.png" alt="Thumbnail" border="0" /></a></td>
<td><a href="img/image-2.jpg" data-lightbox="web" data-title="This is second image caption"><img style="display: block; margin-left: auto; margin-right: auto;" src="images/thumbnail.png" alt="Thumbnail" border="0" /></a></td>
<td><a href="img/image-3.jpg" data-lightbox="web" data-title="This is third image caption"><img style="display: block; margin-left: auto; margin-right: auto;" src="images/thumbnail.png" alt="Thumbnail" border="0" /></a></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td style="text-align: left;">
<p> </p>
<p><img style="display: block; margin-left: auto; margin-right: auto;" src="images/quest_design_design_gallery_header.png" alt="" /></p>
<p> </p>
</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td><a href="img/image-1.jpg" data-lightbox="design" data-title="This is first image caption"><img style="display: block; margin-left: auto; margin-right: auto;" src="images/thumbnail.png" alt="Thumbnail" border="0" /></a></td>
<td><a href="img/image-2.jpg" data-lightbox="web" data-title="This is second image caption"><img style="display: block; margin-left: auto; margin-right: auto;" src="images/thumbnail.png" alt="Thumbnail" border="0" /></a></td>
<td><a href="img/image-3.jpg" data-lightbox="web" data-title="This is third image caption"><img style="display: block; margin-left: auto; margin-right: auto;" src="images/thumbnail.png" alt="Thumbnail" border="0" /></a></td>
<td>   </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td style="text-align: center;">
<p> </p>
<p><img src="images/quest_design_image_gallery_header.png" alt="" /></p>
</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td><br /><a href="img/image-1.jpg" data-lightbox="image" data-title="This is first image caption"><img style="display: block; margin-left: auto; margin-right: auto;" src="images/thumbnail.png" alt="Thumbnail" border="0" /></a></td>
<td><br /><a href="img/image-2.jpg" data-lightbox="image" data-title="This is second image caption"><img style="display: block; margin-left: auto; margin-right: auto;" src="images/thumbnail.png" alt="Thumbnail" border="0" /></a></td>
<td><br /><a href="img/image-3.jpg" data-lightbox="image" data-title="This is third image caption"><img style="display: block; margin-left: auto; margin-right: auto;" src="images/thumbnail.png" alt="Thumbnail" border="0" /></a></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
<p style="text-align: center;"> </p>

Любая помощь будет большой.

http://www.webbmaster.com.au/веб-программы /questdesign /index.php /фолиант

1 голос | спросил Kyle 29 Jam1000000amThu, 29 Jan 2015 08:56:31 +030015 2015, 08:56:31

1 ответ


1

В вашем шаблоне CSS-файл может быть некоторый стиль, который переопределяет стиль для таблицы.

По умолчанию будет работать следующее:

table {
    width: 500px;
    margin: 0 auto;
}

Конечно, вы должны назначить класс или идентификатор вашей таблице и указать вместо этого.

Или вы можете обернуть таблицу в div так:

<div style="text-align:center">    
   <table style="display: inline-table;">  

   </table>
</div>
ответил Lodder 29 Jpm1000000pmThu, 29 Jan 2015 12:05:00 +030015 2015, 12:05:00

Похожие вопросы

Популярные теги

security × 330linux × 316macos × 2827 × 268performance × 244command-line × 241sql-server × 235joomla-3.x × 222java × 189c++ × 186windows × 180cisco × 168bash × 158c# × 142gmail × 139arduino-uno × 139javascript × 134ssh × 133seo × 132mysql × 132