Il parait que les tableaux c'est *mal*

Le
fra
Bonjour

Il parait que les tableaux c'est *mal* (c) depuis html5.

Quelqu'un pourrait-il me dire par quoi remplacer ce code pour que ça
donne la même chose (une div scrollable à l'horizontal et qui ne déborde
pas de la page) :

--
<div id="real" align="center" style="overflow:auto;">
<table border="0" cellpadding="2" cellspacing="0" width="223%">
<tbody>
<tr>
<td valign="top"><img src="img_3979-2.jpg"
alt="" align="left" hspace="0" vspace="0"
width="100%"> </td>
<td valign="top"><img src="img_3980-2.jpg"
alt="" align="left" hspace="0" vspace="0"
width="100%"></td>
<td valign="top"><img src="photo-0016-2.jpg"
alt="" align="left" hspace="0" vspace="0"
width="100%"> </td>
<td valign="top"><img src="img_3982-2.jpg"
alt="" align="left" hspace="0" vspace="0"
width="100%"></td>
<td valign="top"><img src="img_3981-2.jpg"
alt="" align="left" hspace="0" vspace="0"
width="100%"> </td>
<td valign="top"><img src="img_3961-2.jpg"
alt="" align="left" hspace="0" vspace="0"
width="100%"></td>
</tr>
</tbody>
</table>
</div>
--

Si en plus ça pouvait être automatiquement à 100% de la hauteur de la
fenêtre ça serait idéal.

Merci d'avance.
--
Fra
Vidéos High-Tech et Jeu Vidéo
Téléchargements
Vos réponses Page 1 / 6
Gagnez chaque mois un abonnement Premium avec GNT : Inscrivez-vous !
Trier par : date / pertinence
Photo
Le #26340136
Le 20/02/2015 19:40, Fra a écrit :
Bonjour

Il parait que les tableaux c'est *mal* (c) depuis html5.

Quelqu'un pourrait-il me dire par quoi remplacer ce code pour que ça
donne la même chose (une div scrollable à l'horizontal et qui ne déborde
pas de la page) :

-----
<div id="real" align="center" style="overflow:auto;">
<table border="0" cellpadding="2" cellspacing="0" width="223%">
<tbody>
<tr>
<td valign="top"><img src="img_3979-2.jpg"
alt="" align="left" hspace="0" vspace="0"
width="100%"> </td>
<td valign="top"><img src="img_3980-2.jpg"
alt="" align="left" hspace="0" vspace="0"
width="100%"></td>
<td valign="top"><img src="photo-0016-2.jpg"
alt="" align="left" hspace="0" vspace="0"
width="100%"> </td>
<td valign="top"><img src="img_3982-2.jpg"
alt="" align="left" hspace="0" vspace="0"
width="100%"></td>
<td valign="top"><img src="img_3981-2.jpg"
alt="" align="left" hspace="0" vspace="0"
width="100%"> </td>
<td valign="top"><img src="img_3961-2.jpg"
alt="" align="left" hspace="0" vspace="0"
width="100%"></td>
</tr>
</tbody>
</table>
</div>
-----

Si en plus ça pouvait être automatiquement à 100% de la hauteur de la
fenêtre ça serait idéal.

Merci d'avance.




A mon avis des simples <div> devraient suffire pour un simple empilement
d'images, non ?

Et pourquoi pas un UL, LI pour faire plus pro...

Les tables sont réservées maintenant aux tableaux purs et durs mais j'ai
eu du mal à m'en séparer de mes bonnes vieilles tables ;-)

--
http://grenault.net/accueil.htm
fra
Le #26340159
Photo
A mon avis des simples <div> devraient suffire pour un simple empilement
d'images, non ?

Et pourquoi pas un UL, LI pour faire plus pro...



Les essais que j'ai pu faire n'ont jamais donné le même résultat. Soit
ça débordait avec un ascenceur en bas (au lieu de sur la div), soit ça
n'avait pas la bonne taille (images trop petite pour finir par tenir
toutes dans la largeur, ou alors à 100% de leur hauteur ce qui est trop
sur les téléphones).
Tu aurais une trame ?
--
Fra
SAM
Le #26340195
Le 20/02/15 19:40, Fra a écrit :
Bonjour

Il parait que les tableaux c'est *mal* (c) depuis html5.



c'est "mal" depuis HTML.4 !!! (et même 3 ?)

D'abord parce que les tables c'est très lourd à maintenir
ensuite ça fatigue pas mal les navigateurs (surtout l'autre là !)

Mais et surtout à cause de l'accessibilité, le fonctionnement de lecture
des tables par les brouteurs vocaliseurs est complétement ignoré du
monde "normal", et c'est assez hard de se dépatouiller de ces
vocalisateurs !!
Avant (et aussi au final) toute "mise en page" ou "mise en forme" il
faut s'assurer que sans aucune FdS ni JS l'affichage est clair et
parfaitement organisé, contrôler que dans les tables colonnes et rangées
ne sont pas farfelues du type : un titre en C1R1 et son § en C2R2 et une
image en C12R1 (javais une vidéo ou sono exemple de lecteur buttant sur
des cellules)


Accessibilté des tableaux en 4 points :


Quelqu'un pourrait-il me dire par quoi remplacer ce code pour que ça
donne la même chose (une div scrollable à l'horizontal et qui ne déborde
pas de la page) :

-----
<div id="real" align="center" style="overflow:auto;">



<p style="display:inline">
et là on met les images en les collant (sans espace entre elles) sans
autre forme de procès
</p>
</div>




Pourquoi les insérer dans un table ?

Si en plus ça pouvait être automatiquement à 100% de la hauteur de la
fenêtre ça serait idéal.



N'importe quoi !

J'ai un NetBook de 600px de haut et un iMac de 1440px de haut
Comment comptes-tu accorder les 2 ?

laisse-moi(laisse-nous) mettre les images à la taille que je veux (nous
voulons), déjà qu'elles sont forcées en pleine largeur !



Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
SAM
Le #26340194
Le 20/02/15 20:19, Photo a écrit :
Le 20/02/2015 19:40, Fra a écrit :
Bonjour

Il parait que les tableaux c'est *mal* (c) depuis html5.

Quelqu'un pourrait-il me dire par quoi remplacer ce code pour que ça
donne la même chose (une div scrollable à l'horizontal et qui ne déborde
pas de la page) :



A mon avis des simples <div> devraient suffire pour un simple empilement
d'images, non ?



M'enfin !
C'est quoi cette manie de rajouter de l'inutile ???

Les images ça se pose là en vrac et elles s'organisent toutes seules,
elles sont naturellement de type "en ligne" et se rangent côte à côte
sur la ligne tant qu'il y a de la place sur cette ligne.

Y a rien de lus simple !

Et pourquoi pas un UL, LI pour faire plus pro...



et allons-y !!

non sens !!!
ce n'est pas une liste !!!


Les tables sont réservées maintenant aux tableaux purs et durs mais j'ai
eu du mal à m'en séparer de mes bonnes vieilles tables ;-)



Pourtant ... depuis les années 2000 qu'on le dit !!!



Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
SAM
Le #26340191
Le 20/02/15 23:20, SAM a écrit :

Les images ça se pose là en vrac et elles s'organisent toutes seules,



démo :



Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
fra
Le #26340260
SAM
tant qu'il y a de la place sur cette ligne.



C'est bien ça le problème. Moi je veux un seul bandeau d'image qu'on
fait scroller à l'horizontale mais avec l'ascenseur sur le bloc pour pas
que toute la page scrolle à droite. (d'où le overflow)
--
Fra
fra
Le #26340258
SAM



C'est pas mal, ça si ce n'est que mes images sont verticales (j'ai
oublié de le préciser) et donc je ne les veux pas à 100 % de la largeur
de la page sinon elles dépassent en hauteur ! Je souhaites que leur
nombre visible (pas forcément entier) s'adapte selon la largeur et que
la hauteur ne dépasse jamais 100 % de la fenêtre.
--
Fra
fra
Le #26340259
SAM
<p style="display:inline">
et là on met les images en les collant (sans espace entre elles) sans
autre forme de procès
</p>



et si ça dépasse la largeur de la fenêtre il se passe quoi ? (moi je
veux un seul bandeau avec sa scollbar).
--
Fra
Paul Gaborit
Le #26340301
À (at) Sat, 21 Feb 2015 12:52:25 +0100,
(Fra) écrivait (wrote):

SAM
tant qu'il y a de la place sur cette ligne.



C'est bien ça le problème. Moi je veux un seul bandeau d'image qu'on
fait scroller à l'horizontale mais avec l'ascenseur sur le bloc pour pas
que toute la page scrolle à droite. (d'où le overflow)



Il suffit de placer toutes les images les unes à la suite des autres
dans un div de class 'bandeau' avec :

.bandeau {
white-space: nowrap;
width: 100%;
overflow-x: auto;
}

.bandeau img {
height: 100%;
}

--
Paul Gaborit -
SAM
Le #26340303
Le 21/02/15 12:52, Fra a écrit :
SAM



C'est pas mal, ça si ce n'est que mes images sont verticales (j'ai
oublié de le préciser) et donc je ne les veux pas à 100 % de la largeur
de la page sinon elles dépassent en hauteur ! Je souhaites que leur
nombre visible (pas forcément entier) s'adapte selon la largeur et que
la hauteur ne dépasse jamais 100 % de la fenêtre.



J'ai rien compris !

Je t'ai donné le modèle/canevas
yapuka ...

surtout qu'en plus le prémâché qui pourrait convenir est déjà proposé en
variante à l'url ci-dessus !

Le truc est de régler le "viewer", le reste s'y adapte automatiquement
moyennant affinement de réglages suivant le nombre de vues


Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
Publicité
Poster une réponse
Anonyme