Imposer la taille d'un tableau html

Signaler
Messages postés
5
Date d'inscription
jeudi 15 octobre 2009
Statut
Membre
Dernière intervention
4 janvier 2021
-
 Toumax -
bonjour,

je met des vidéos sur mon site mais le code html ne respecte pas vraiment la taille du tableau en pixels une fois en ligne. Quelle solution pour forcer la taille du tableau? Mettre un peu de code autre que du html? Merci pour votre aide.

Voici le code que j'utilise:
<table
 style="width: 358px; height: 300px; text-align: center; overflow: auto; margin-left: auto; margin-right: auto;"
 border="5" bordercolor="#ffffff" cellpadding="0"
 cellspacing="0">
              <tbody>
                <tr>
                  <td =""><video
 contextmenu="return false;" oncontextmenu="return false;"
 width="358" height="300" preload="none"
 controls="" controlslist="nodownload" playercolor=""
 poster="/videos/all2020/quill-promo.jpg"> <source
 src="/videos/all2020/quill-promo.mp4" type="video/mp4"></source></video></td>
                </tr>
              </tbody>
            </table>

EDIT : Ajout des balises de code. Merci d'y penser à l'avenir

Explications disponibles ici ( à lire ENTIEREMENT !! ) : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code

2 réponses

Messages postés
637
Date d'inscription
lundi 28 octobre 2013
Statut
Membre
Dernière intervention
10 janvier 2021
244
Bonsoir,
vous avez oublié de préciser l'unité des PX dans le tag <video>

<table
style="width: 358px; height: 300px; text-align: center; overflow: auto; margin-left: auto; margin-right: auto;"
border="5" bordercolor="#ffffff" cellpadding="0"
cellspacing="0">
<tbody>
<tr>
<td =""><video
contextmenu="return false;" oncontextmenu="return false;"
width="358px" height="300px" preload="none"
controls="" controlslist="nodownload" playercolor=""
poster="/videos/all2020/quill-promo.jpg"> <source
src="/videos/all2020/quill-promo.mp4" type="video/mp4"></source></video></td>
</tr>
</tbody>
</table> 


EDIT: Correction des balises de code. Ajout du LANGAGE

Si ma réponse vous satisfait, un simple clic sur "+1"!! m'ira très bien :-)
Cordialement Foxyfox51
Messages postés
5
Date d'inscription
jeudi 15 octobre 2009
Statut
Membre
Dernière intervention
4 janvier 2021

bonjour foxyfox51,

Dans le tag vidéo, il y a la largeur et la longueur (358x300).
Peut-être sont-ils mal codés?
>
Messages postés
5
Date d'inscription
jeudi 15 octobre 2009
Statut
Membre
Dernière intervention
4 janvier 2021

Salut,
un tableau(table)doit s'utiliser uniquement que pour les données tabulaires(une liste en lignes/colonnes avec des prix/noms etc...).
Ici je ne voit pas son intérêt puisque un tableau de une seule colonne et une seule ligne ça s'appelle un bloc et il en existe tout un paquet des blocs servant de containers( article, span, p, div,...). Chacun en fonction du sens du contenu et de sa hiérarchie bien évidemment.

Un problème important me semble que vous indiquez la taille du container(la table) et de son contenu(la vidéo) exactement identique. Hors le contenant ayant des bordures (au moins 1 pixel pour les 4 côtés) et des marges(internes/externes) le contenu aura du mal à rentrer entièrement ou sera rogné.
Donc vous devez tenir compte de ces espaces , qui par défaut sur une table à un cadre(l'espace qui est réduit de l'espace contenu).

Les dimensions et Les proportions:

comme toute la mise en page indiquer les tailles se fait en CSS(ou alors c'est plus compliqué et dépréciée car une ancienne méthode beaucoup moins pratique et il faut l'indiquer dans le DOCTYPE).
Vous l'utilisez avec l'attribut de balise style dans le cas de la table mais pas de la vidéo.(notez qu'il y a mieux comme pratique: en regroupant tout le CSS ensemble, éventuellement dans un fichier externe qui peut être réutilisé/interchangé pour d'autre pages)

Il est périlleux d'indiquer des dimensions bornées pour une page web, comme en pixels.
En effet chaque utilisateur à une taille/résolution d'écran différente. L'affichage ne sera donc pas le même pour chacun, particulièrement vrai avec les appareils portables comme les tablettes ou smartphone, mais dans tous les cas la mise en page risque de ne plus se faire/se décaler et donner à l'utilisateur qu'un résultat bugué.
Pour résoudre cela il faut utiliser des dimensions relatives, comme le pourcentage(symbole '%') puisque 10% de la page sera toujours identique chez tout le monde.

http://www.css-faciles.com/unites-css.php
Messages postés
5
Date d'inscription
jeudi 15 octobre 2009
Statut
Membre
Dernière intervention
4 janvier 2021

Bonjour Toumax,

merci pour la réponse.
La vidéo est dans un tableau car cela a une très grande importance pour la mise en page de mon site (ce serait trop long à expliquer et cela serait hors-sujet).

Le fait que la vidéo soit de la même taille que le tableau ne change rien car j'ai déjà fait des tests en essayant différentes options de tailles.

Je n'y connait rien en langage css. Où le placer exactement dans le code? Et quel code css dois-je mettre? Surtout, sera t'il efficace pour imposer une taille précise de la vidéo?
"La vidéo est dans un tableau car cela a une très grande importance pour la mise en page de mon site (ce serait trop long à expliquer et cela serait hors-sujet)."
"
Pas du tout , on parle bien de mise en page quoi d'autre tant que le lien hypertexte est bon?).
Pour une page web la mise en page = CSS.

"Le fait que la vidéo soit de la même taille que le tableau ne change rien car j'ai déjà fait des tests en essayant différentes options de tailles. "
Non justement pas de la même taille puisque(il me semble l'avoir dit) vous ne comptez pas les bordures(margin et padding ou marges internes et externes) ni ce qui apparaît pour le cadre. Vous pouvez très bien voir les dimensions exactes en utilisant les outils du développement de votre navigateur ou bien calculer vous même les dimensions restantes(donc sans la taille des marges et du cadre d'un tableau).

Quant aux "options de tailles" avez vous utilisé des dimensions relatives comme je vous le conseille?


"Je n'y connait rien en langage css."
Une seule solution alors: apprendre. Voir lien plus haut.

Dans votre exemple vous utilisez bien CSS donc votre question est plutôt curieuse.
Vous pouvez très bien l'utiliser de la même façon(dans la balise style de la balise), j'ai expliqué aussi qu'il y a de meilleures façons et donner un lien pour apprendre donc je ne vois pas ce qui vous manque pour y travailler.

Quant à un tableau c'est un élément HTML comme un autre sauf qu'il n'est pas fait pour ce que vous voulez faire.
La mise en page n'a rien à voir puisque c'est le rôle de CSS et un tableau ou un div(article, section etc...) sont des éléments HTML.
CSS permet(entre autres mais surtout) de définir des "paramètres" pour les éléments HTML, par exemple la mise en page(les dimensions, formes, cadres, marges, couleurs etc...).
Bref que vous donniez des propriétés CSS à une balise ou à une autre ce sont bien les même propriétés: par exemple la taille(en pixel ou mieux en pourcentage). Table ou div ou article, section auront la même taille, apparence ou mise en page, c'est bien le but du CSS.
Et tout cela DOIT passer par CSS , ce n'est pas une règle que l'on peut contourner depuis plus de 15 ans.
La réponse pour la mise en page est donc bien CSS et non HTML.
HTML sert à indiquer les éléments (et leurs valeurs sémantique et hiérarchie) uniquement.
mise en page = CSS

Vous avez ceci aussi: https://www.google.fr/search?q=apprendre+CSS

Que la réponse ne vous convienne pas n'empêche pas que ce soit la seule (valable et de qualité) donc revoyez votre méthode ou vos connaissances pour apprendre si vous voulez un résultat correct ;)


bon boulot