<a> тег в таблице <td>тег - PullRequest
Новая
       12

<a> тег в таблице <td>тег

0 голосов
/ 21 ноября 2018

Я создал две таблицы, в таблице 2 я только что добавил тег.Ячейка, в которой используется тег, автоматически расширяется.Будет ли кто-нибудь любезно объяснить, что происходит.Что является лучшим способом для автоматической регулировки размеров столбцов одинаково при добавлении тега в ячейке.Я хочу, чтобы после добавления тега Таблица-2 выглядела как Таблица-1. 

<table width="100%">
  <tr height="40">
    <td style=" border: 2px dotted orange" colspan="5" height="auto" align="center">
      <p>Table-1</p>
    </td>

    <tr height="40">
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
    </tr>
    <tr height="40">
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
    </tr>

</table>
<br />
<br />
<br />
<table width="100%">
  <tr height="40">
    <td style=" border: 2px dotted orange" colspan="5" height="auto" align="center">
      <p>Table-2</p>
    </td>

    <tr height="40">
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
    </tr>
    <tr height="40">
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"><a href="http://www.google.com">Search</a></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
    </tr>

</table>

Ответы [ 2 ]

0 голосов
/ 21 ноября 2018

Просто используйте: 

td{
width:20%
}


td{
width:20%;
}
<table width="100%">
  <tr height="40">
    <td style=" border: 2px dotted orange" colspan="5" height="auto" align="center">
      <p>Table-1</p>
    </td>

    <tr height="40">
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
    </tr>
    <tr height="40">
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
    </tr>

</table>
<br />
<br />
<br />
<table width="100%">
  <tr height="40">
    <td style=" border: 2px dotted orange" colspan="5" height="auto" align="center">
      <p>Table-2</p>
    </td>

    <tr height="40">
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
    </tr>
    <tr height="40">
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"><a href="http://www.google.com">Search</a></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
      <td style=" border: 2px dotted orange"></td>
    </tr>

</table>
0 голосов
/ 21 ноября 2018

Вы можете использовать свойство table-layout.В вашем HTML это будет выглядеть так: 

<table width="100%" style=" table-layout: fixed">

... но в идеале это должно быть в вашей таблице стилей CSS.

...