• Site mis à jour le 11 mars 2024

Mise en page articles en div au lieu de tableaux

Informations
il y a 9 ans 2 mois - il y a 9 ans 2 mois #10295 par Django29
Bonjour

N'étant pas programmeur à la base, j'ai toujours fait mes mises en pages d'articles Joomla à partir de tableaux sans bordures, de 2 ou 3 colonnes en général, en largeur 100%.
Conséquence : l'affichage sur les mobiles déborde. Les colonnes de tableaux avec images redimensionnées en largeurs fixes (+ popup) ne se réduisent pas à la taille de l'écran, contrairement aux templates récents qui ajustent la position des menus et modules.

Il semblerait que l'on puisse utiliser les div à la place des tableaux.
Existe-t-il un tutoriel sur les div dans JCE ?
Dernière édition: il y a 9 ans 2 mois par Django29.

Connexion ou Créer un compte pour participer à la conversation.

Informations
il y a 9 ans 2 mois #10300 par mihaly
Réponse de mihaly sur le sujet Mise en page articles en div au lieu de tableaux
Hello,
Non il n'existe pas de tutoriel lié à JCE à ce sujet car il faut coder le style manuellement à la div avec les propriétés CSS. Exemple :
<div style="float:left"></div>

Mihàly Marti alias Sarki

Connexion ou Créer un compte pour participer à la conversation.

Informations
il y a 9 ans 2 mois #10301 par Django29
Réponse de Django29 sur le sujet Mise en page articles en div au lieu de tableaux
Salut Mihaly

J'ai bien trouvé quelques cours sur les div, mais après plusieurs heures passées à essayer de créer un article Joomla basé sur ce principe, j'ai fini par revenir au bon vieux tableau, beaucoup plus simple à comprendre et utiliser.

Est-ce qu'il y a des gourous de Joomla qui n'utilisent, comme moi, que des tableaux pour la mise en page de leurs articles Joomla, ou suis-je un marginal ringard :S ?

Connexion ou Créer un compte pour participer à la conversation.

Informations
il y a 9 ans 2 mois #10302 par mihaly
Réponse de mihaly sur le sujet Mise en page articles en div au lieu de tableaux
Assurément non, et cela n'a rien à voir avec Joomla...
Tout initié web sait qu'il ne faut jamais mettre un contenu qui doit être référencé et accessible dans un tableau, les systèmes de lecture ne lisent pas correctement dans les tableaux.
Et évidemment maintenant avec les tablettes et smartphones je n'en parle même pas.
Tiens, ce peut être une solution pour des tableaux obligatoires, mais n'utilisa pas les tableaux à tout va : www.web-eau.net/blog/tableaux-responsive-quelles-approches-pour-quelles-solutions

Comme je t'ai dit c'est pas compliqué et je suis sûr qu'en faisant une recherche sur le eweb tu as plein d'exemples :
Il faut aligner les div à gauche sauf la dernière d'une ligne et lui donner une taille de largeur et de hauteur :
<div style="float:left; height: 100px; width: 100px;">Contenu</div>

Mihàly Marti alias Sarki

Connexion ou Créer un compte pour participer à la conversation.

Informations
il y a 9 ans 2 mois #10318 par Django29
Réponse de Django29 sur le sujet Mise en page articles en div au lieu de tableaux
Après quelques heures passées à essayer de créer un article uniquement en div, et à arracher les cheveux qui me restent, j'ai fini par tout effacer et le refaire avec un tableau.

Je sais que ça n'est que parce que je ne connais pas suffisamment les div, mais je n'ai plus le temps d'étudier la chose pour ce site.

Ma mise en page d'article est en 3 lignes et 3 colonnes, avec des textes ou/et images dans chaque cellule.

Dès que possible, j'essaierai d'étudier les tutoriels du W3school, mais les div me semblent nettement plus compliqués que les tableaux (nécessité de créer un fichier CSS lié aux id de div)

Connexion ou Créer un compte pour participer à la conversation.

Informations
il y a 9 ans 2 mois #10319 par mihaly
Réponse de mihaly sur le sujet Mise en page articles en div au lieu de tableaux
Je comprends que ce ne soit pas si simple que les tableaux, utilise le plugin que je t'ai conseillé si tu fais des tableaux, ou donne-leur une largeur de 100%, surtout pas une taille en pixels. Attention, si turedimensionnes ton ttableau avec les poignées, des valeurs de largeur et hauteur en pixels seront appliquées.
Cela dit tu t'es certainement compliqué la tâche, tu n'as pas à appliquer des id et des classes, il suffit de mettre le curseur dans une cellule pour afficher les balises dans l'ordre dans la barre d'état de l'éditeur, puis de cliquer sur celle du tableau (table) et finalement de cliquer sur l'icône AA (style xhtml) de l'éditeur pour appliquer toutes les valeurs de style que tu veux. Ceci est applicable pour n'importe quelle balise.
Bonne suite ;)

Mihàly Marti alias Sarki

Connexion ou Créer un compte pour participer à la conversation.

Temps de génération de la page : 0.194 secondes
Propulsé par Kunena

Rechercher