Text align center

flexi2202 -
flexi2202 - 23 févr. 2011 à 18:15

Bonjour,
je débute en css et je bloque sur une propriété pour centrer un texte horizontalement c est text align center mais pour le positionner en vertical c est quoi ...je cherche mais je trouve pas
en fait j ai fait un tableau en html
et je desire y placer des classes en css
je commence donc par le titre
avec <h3 class="browseProductTitle"> A008POINTURE35 </h3>
que je mets entre <td>et </td>
mais rien a faire il ne veux pas se positionner sur le bord supérieur de mon tableau
que devrais ajouter dans ma classe browseProductTitle

merci de votre aide

Afficher la suite

A voir également:

Text align center
Control center 4 - Télécharger - Divers Utilitaires
Copytrans control center - Télécharger - Divers Utilitaires
Catalyst control center - Télécharger - Pilotes & Matériel
Sms to text - Télécharger - Sauvegarde
Family center - Guide

10 réponses

Réponse 1 / 10

boly38 Messages postés 267 Date d'inscription Statut Membre Dernière intervention 80

peut-être essayer de chercher autour de la propriété vertical-align
pour un style appliqué à la cellule de ton tableau (le TD) et non au titre.

exemple de style :

.cell {
 vertical-align: middle
}

par exemple :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <style type="text/css">
.cell {
 vertical-align: middle
}
  </style>
  <title></title>
  </head>
  <body>
<table border="3">
<tr>
 <td class="cell">oO</td><td> 11<br/>22<br/>33</td>
</tr>
</table>
  </body>
</html>

PS : en HTML4 le TD possède aussi un attribut "valign" :

 <td valign="middle">oO</td><td> 11<br/>22<br/>33</td>

Réponse 2 / 10

flexi2202

merci pour la réponse c est gentil pour l exemple
disons que je suis embêter car j ai donc 4 colonnes en html avec a l intérieur des lignes et je souhaiterais faire un cadre autour de chaque colonne ....pour la gauche et la droite aucun soucis je fusionne des lignes mais pour le bas et haut je bloque
donc on me dit que cela est possible en css ....je me casse la tete depuis qlqes heures mais ....j y arrive pas

Réponse 3 / 10

boly38 Messages postés 267 Date d'inscription Statut Membre Dernière intervention 80

tente le style css suivant :

.cell {
  border-top: 1px solid black;
  border-bottom: 3px dashed grey;
  border-left: 1px solid yellow;
  border-right: 1px solid green;
}

avec pour la table (éviter les duplication de bordures je crois) :

.table {
 border-collapse: collapse;
}

Réponse 4 / 10

flexi2202

cela a l air de fonctionner et pour ceci j ai pas trop bien compris stp

un immense merci a toi

.table {
border-collapse: collapse;
}

boly38 Messages postés 267 Date d'inscription Statut Membre Dernière intervention 80

cf. https://www.zonecss.fr/proprietes-css/border-collapse-css.html

en fait dit autrement, ce mode d'affichage évite 2 bordures collées pour 2 cellules de tableau voisines (n'en produit qu'une seule commune).

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 10

flexi2202

et si j ai ceci par exemple
<tr>
<td>a</td>
<td>b</td>
<td>c</td>
<td>d</td>
</tr>
<tr>
<td>aa</td>
<td>bb</td>
<td>cc</td>
<td>dd</td>
</tr>
<tr>
<td>aaa</td>
<td>bbb</td>
<td>ccc</td>
<td>ddd</td>
</tr>
<tr>
<td>aaaaa</td>
<td>bbbbb</td>
<td>cccc</td>
<td>dccc</td>
</tr>

comment faire pour que les cellules a,aa,aaa;aaaa soit entourée par un seul cadre a l intérieur du quel ces cellules seraient

Réponse 6 / 10

flexi2202

j ai essayer ceci mais il me reste des traces blanches entre les cellules

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style type="text/css">
.cell3 {
border-top: 1px solid red;
border-left: 1px solid red;
border-right: 1px solid red;
}
.cell2 {
border-right: 1px solid red;
border-left: 1px solid red;
}
.cellb {
border-bottom: 1px red;
border-left: 1px solid red;
border-right: 1px solid red;
}

</style>
<title></title>
</head>
<body>
<table border="0" bgcolor="#dfebff" style="width: 666px; height: 431px;">
<tr>
<td class="cell2">aa</td>
<td>bb</td>
<td>cc</td>
<td>dd</td>
</tr>
<tr>
<td class="cell2">aaa</td>
<td>bbb</td>
<td>ccc</td>
<td>ddd</td>
</tr>
<tr>
<td class="cellb">aaaaa</td>
<td>bbbbb</td>
<td>cccc</td>
<td>dccc</td>
</tr>
</tr>
</table>
</body>
</html>

Réponse 7 / 10

boly38 Messages postés 267 Date d'inscription Statut Membre Dernière intervention 80

sans faire 2 tableaux ou sans "rawspan" je dirai comme ceci (même si c'est pas terrible!)

<html>
  <head>
  <style type="text/css">
.celltop {
  border-left: 1px solid grey;
  border-right: 1px solid grey;
  border-top: 1px solid grey;
}
.cellmiddle {
  border-left: 1px solid grey;
  border-right: 1px solid grey;
}
.cellbottom {
  border-right: 1px solid grey;
  border-left: 1px solid grey;
  border-bottom: 1px solid grey;
}
  </style>
  <title></title>
  </head>
  <body>
<table cellpadding="3" cellspacing="0">
<tr>
<td class="celltop">a</td>
<td>b</td>
<td>c</td>
<td>d</td>
</tr>
<tr>
<td class="cellmiddle">aa</td>
<td>bb</td>
<td>cc</td>
<td>dd</td>
</tr>
<tr>
<td class="cellmiddle">aaa</td>
<td>bbb</td>
<td>ccc</td>
<td>ddd</td>
</tr>
<tr>
<td class="cellbottom">aaaaa</td>
<td>bbbbb</td>
<td>cccc</td>
<td>dccc</td>
</tr> 
</table>
  </body>
</html>

Réponse 8 / 10

flexi2202

ah mais cela me semble nickel car entre deux colonnes je fais des fusions de lignes

Réponse 9 / 10

flexi2202

super grand merci a toi
pour ton aide

Réponse 10 / 10

flexi2202

ok super tout fonctionne a merveille encore merci

Discussions similaires

A quoi sert ETDctrl ? Peut-on le supprimer ?

ETD Control Helper dans System32 - Dois-je le supprimer ?

Soulager Windows au Demarrage

MSI Center ne veut pas se lancer

A quoi sert ATI Catalyst Control Center ?

Votre réponse

Discussions similaires