28172 sujets

CSS et mise en forme, CSS3

Bonjour,
quand on sait plus quoi faire...Alsacréation!
Je voudrais diminuer la hauteur des lignes d'un tableau.
j'ai pas mis de Css car tableau très simple, voila le code
<table >
<tr height="10px" border align="left">
              <td>Mauleon</td>
              <td>8h00, sur la place</td>
</tr>
<tr height="10px" border align="left">
               <td>Saint Palais</td>
               <td>8h30, église</td>
</tr>
.....
</table>

Mais si je change "height" en % ou autre, ça fonctionne pas.
Savez vous pourquoi?
Merci pour votre aide.
Modifié par abeille (22 Mar 2017 - 08:34)
Modérateur
Salut Abeille

abeille a écrit :
j'ai pas mis de Css car tableau très simple

C'est pas une raison ! Smiley lol

Au passage ton second span est ouvert avec une balise fermante.

abeille a écrit :
Mais si je change "height" en % ou autre, ça fonctionne pas.

En % de quoi du coup ? De la hauteur de ton tableau, sauf.... qu'il prend la taille de ses enfants.... c'est un peu comme le serpent qui se mord la queue non ?! Smiley lol
Si tu veux des % sur les lignes il va falloir donner une taille a ton tableau !
_laurent a écrit :

En % de quoi du coup ? De la hauteur de ton tableau, sauf.... qu'il prend la taille de ses enfants.... c'est un peu comme le serpent qui se mord la queue non ?! Smiley lol
Si tu veux des % sur les lignes il va falloir donner une taille a ton tableau !
Bonjour, merci pour la réponse, mais j'ai défini aussi la hauteur du tableau (<table height="100%">) et j'arrive toujours pas à changer la hauteur des cellules.
Ou alors en passant par le Css?
Modérateur
Coucou,

Je me suis peut être un peu emporté en fait. Ca marche plutôt comme le flex (ça prend toute la place dispo etc) comme l'explique gcyrillus avec ses liens.

On peut peut être reprendre le problème plus en amont. Tu cherches à faire quoi exactement ?
_laurent a écrit :
Coucou,

Je me suis peut être un peu emporté en fait. Ca marche plutôt comme le flex (ça prend toute la place dispo etc) comme l'explique gcyrillus avec ses liens.

On peut peut être reprendre le problème plus en amont. Tu cherches à faire quoi exactement ?
No souci. Merci de m'aider.
Je voudrais juste arriver à régler la hauteur des cellules d'un tableau basique.
J'ai essayé dans le Html avec <td height="10px">
J'ai essayé de faire une class pour le Css avec <td class="hauteurcellule">
Mais rien à faire ça ne bouge pas.
En fait, c'est parce que j'ai déjà un tableau sur une autre page dont le CSS est:
td{border: 20px solid #f2f2f2; border-bottom: 30px solid #f2f2f2;}

Je suppose que c'est pour ça que j'arrive pas à changer la hauteur des lignes de mon nouveau tableau.

Bon, j'espère que tu m'auras compris!
Merci.
(le lien vers le tableau en question: http://www.cours-de-basque.fr/agenda.html
Modifié par abeille (22 Mar 2017 - 21:27)
Modérateur
Alors ça ne bouge pas parceque le table est un peu rigide. Il ne peux pas prendre une hauter de cellule inférieur à la hauteur de ligne. Si tu mets plus grand ca bougera. C'est juste que tu peux pas le mettre plus petit que son contenu.

C'est généralement un mauvaise idée et très difficile de vouloir contraindre à tout prix le tableau comme ça. Autant le laisser se positionner naturellement et jouer sur la hauteur de ligne, la taille de la police et les bords (padding / border)

Et effectivement il y a des gros border qui prennent de la place, tu peux mettre une classe spécifique sur ce tableau et overider les propriété juste pour ce tableau du genre .tableau2 td { border:0; }
Meilleure solution
_laurent a écrit :
Alors ça ne bouge pas parceque le table est un peu rigide. Il ne peux pas prendre une hauter de cellule inférieur à la hauteur de ligne. Si tu mets plus grand ca bougera. C'est juste que tu peux pas le mettre plus petit que son contenu.

C'est généralement un mauvaise idée et très difficile de vouloir contraindre à tout prix le tableau comme ça. Autant le laisser se positionner naturellement et jouer sur la hauteur de ligne, la taille de la police et les bords (padding / border)

Et effectivement il y a des gros border qui prennent de la place, tu peux mettre une classe spécifique sur ce tableau et overider les propriété juste pour ce tableau du genre .tableau2 td { border:0; }
Bravo! Smiley biggrin
Merci, c'était tout ce qu'il fallait faire.
A Plus.