web-dev-qa-db-fra.com

Comment aligner la valeur de <td rowpan = "value"> pour centrer verticalement

J'ai besoin d'aligner la valeur de la cellule td au centre, à la fois horizontalement et verticalement. a l'attribut rowpan. La sortie en ce moment est comme:

A  |  B  |  C  |  D 
1  |  2  |  3  |  4
1  |  2  |  3  |  
1  |  2  |  3  |  

Voulu:

A  |  B  |  C  |  D
1  |  2  |  3  |  
1  |  2  |  3  |  4
1  |  2  |  3  |  
1  |  2  |  3  |  
10
Azima

Essayez:

<td style="vertical-align : middle;text-align:center;">
18
helpdoc

utilisation <td rowspan="4" align="center">4</td> c'est du travail

table td {
  padding: 5px;
}
<table border="1">
  <tr>
    <td>A</td>
    <td>B</td>
    <td>C</td>
    <td>D</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td rowspan="4" align="center">4</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>

  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>

</table>
2
Bhargav Chudasama

Ajoutez une classe générale dans votre CSS.

 .mytable td[rowspan] {
    vertical-align: middle;
    text-align: center;
}
0
Sameer

Essaye ça:

<td rowspan="4" tyle="text-align:center;">4</td>
0
Faridul Khan

Ajoutez simplement rowpan 4.

<table>
    <tr>
        <td>A</td>
        <td>B</td>
        <td>C</td>
        <td>D</td>
    </tr>
    <tr>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td rowspan="4">1</td>
    </tr>
    <tr>
        <td>1</td>
        <td>1</td>
        <td>1</td>
    </tr>
    <tr>
        <td>1</td>
        <td>1</td>
        <td>1</td>
    </tr>
</table>
0
Subhankar Mitra
<!DOCTYPE html>
<html>
<head>
<style>
#customers td, #customers th {
    border: 1px solid #ddd;
}
</style>
</head>
<body>

<table id="customers">
  <tr>
    <th>Company</th>
    <th>Contact</th>
    <th>Country</th>
  </tr>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Maria Anders</td>
    <td rowspan ="4">Germany</td>
  </tr>
  <tr>
    <td>Berglunds snabbköp</td>
    <td>Christina Berglund</td>
  </tr>
  <tr>
    <td>Centro comercial Moctezuma</td>
    <td>Francisco Chang</td>
  </tr>
  <tr>
    <td>Ernst Handel</td>
    <td>Roland Mendel</td>
  </tr>
 
</table>

</body>
</html>

Le texte est centré aligné par défaut. Veuillez vérifier le CSS existant car il écrase la propriété align.

0
pryashrma

enter image description here

violon vivant

Code

<table class="table table-bordered">
  <thead>
    <tr>
        <td rowspan="2" style="vertical-align: middle;">
            first
        </td>
        <td rowspan="2" style="vertical-align: middle;">
            Second
        </td>
        <td rowspan="2" style="vertical-align: middle;">
            Third
        </td>
        <td rowspan="1" colspan="2">
            Fourth
        </td>
    </tr>
    <tr>
        <td>
          fifth
        </td>
        <td>
          sixth
        </td>
    </tr>
  </thead>
  <tbody>
  </tbody>
</table>
0
rahulworld

essayez:

<td align="center" valign="middle">
0
Upvesh Kumar