как сделать html-таблицу встроенной

<p>в html я хочу отобразить небольшую таблицу как часть абзаца. один из способов сделать это заключается в следующем:</p><pre><code><table> <tr> <td> before <table style="display:inline;"><tr><td>a</td><td>b</td></tr> <tr><td>c</td><td>d</td></tr> </table> after </td> </tr> </table> </code></pre><p>который производит этот хороший макет:</p><pre><code> a b before after c d </code></pre><p>это именно то, что я хочу.</p><p>но мне кажется довольно глупым использовать таблицу внутри таблицы, когда я действительно хочу использовать таблицу внутри абзаца. однако, если я попытаюсь использовать этот html:</p><pre><code><p> before <table style="display:inline;"><tr><td>a</td><td>b</td></tr> <tr><td>c</td><td>d</td></tr></table> after </p> </code></pre><p>я получаю этот уродливый макет:</p><pre><code>before a b after c d </code></pre><p>я пытался использовать различные стили отображения, но ни один из них не делает то, что я хочу.</p><p>я вынужден использовать код «таблица в таблице» или я что-то упустил?</p>

<p>создание абзаца <code>display: inline;</code> работает для меня. но если у вас есть несколько абзацев, вам нужно будет добавить <code><br /></code> после каждого из них.</p>

<p>вы можете использовать следующий css:</p><pre><code>display:inline-table </code></pre><p>только ie7 и ниже не поддерживают это свойство. возможно, завершение таблицы в промежуток с примененным к ней <code>zoom:1</code> может помочь ie7.</p>

<p>я использую браузер chrome в linux, и я могу заставить его работать, добавив <code>display:inline-table</code> в теги параграфа (p) и таблицы:</p><pre><code><p style="display:inline-table;"> before <table style="display:inline-table;"><tr><td>a</td><td>b</td></tr> <tr><td>c</td><td>d</td></tr></table> after </p> </code></pre><p>только что проверил firefox на linux и, похоже, там тоже работает.</p><p>к вашему сведению: удаление любого из двух стилей <code>display:inline-table</code> привело к нежелательному форматированию.</p>

<p>я полагаю, что у вас есть веская причина использовать здесь таблицу вместо css. вы можете получить эффект, используя одну таблицу.</p><pre><code><table> <tr> <td rowspan="2">before</td> <td>a</td> <td>b</td> <td rowspan="2">after</td> </tr> <tr> <td>c</td> <td>d</td> </tr> </table> </code></pre>