Discussion :

[itek2016]

Bonjour a tous,
J'ai un petit soucis avec le css de mon site : le site n'est pas centré, il faut utiliser l’ascenseur du bas et tirer vers la droite pour voir la suite du site, il y a surement une solution, voici le site : achat fichier email
Merci de votre contribution

[Invité]

Bonjour,

C'est que ton site n'est pas adapté aux résolutions inférieures à 1335px de large !

Et quand on regarde le code...
=> On NE fait PLUS de mise en page avec des <table> depuis le siècle dernier.
Les balises <table> ne servent qu'à l'affichage de données tabulaires.

=> Il faut revoir la construction/structure du site avec des balises HTML(5) (récentes, et étudiées pour) : <div>, <section>, <article>,....
=> + ajouter un <DOCTYPE html>

• Initiation à HTML5
• HTML5 : le guide du débutant

[Stellar7]

=> On NE fait PLUS de mise en page avec des <table> depuis le siècle dernier.

Ah ben oui mais non perdu.
C'est vrai que l'accessibilité a tenté d'imposer cela, mais l'accessibilité a perdu et a même dû accepter l'existence de javascript (d'où toutes les balises/attributs RIA).

Même si personnellement je ne le recommande pas, il est toujours tout-à-fait possible de faire de la présentation ou mise en page avec des tableaux. MAIS, il faut a minima ajouter l'attribut role="presentation" (cf. p.ex. les fiches Accede-Web).

[Invité]

@Stellar7
La question n'est pas de savoir si c'est "possible*" ou pas.

La mise en page avec <table> N'EST PLUS du tout recommandée, voire FORTEMENT DECONSEILLEE, car les <table> ne sont (sémantiquement parlant) PAS du tout faites pour ça.

D'autre part, la mise en page avec <table> n'est PLUS DU TOUT adaptée aux médias actuels : PC, tablettes, smartphones.

Le site de l'ami itek2016 en est un exemple flagant, puisque les <table> utilisée EMPECHENT (ou gênent grandement) la possibilité d'avoir un site "responsive" (= adaptation/modification de la mise en page en fonction du média).




* Il est aussi "possible" de mettre son slip après son pantalon, ou ses chaussettes après ces chaussures, mais ce n'est pas RECOMMANDE.

Ni pratique.

Mais peut être drôle.

Pour les autres.

[Invité]

@itek2016

En fouillant un peu dans le code, on trouve dans style.css (ligne 432) :

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
#al {
    min-width: 1335px;
/* ... */
}

EN SUPPRIMANT min-width: 1335px;, il est alors possible de rendre le site "responsive".....
...jusqu'à ce que les <table> atteignent leur limite de largeur mini (limité par leurs contenus), aux alentours de 665px de largeur de fenêtre (ici).

Cela dit, la limite de lisibilité des contenus (due à la réduction de la largeur des colonnes* des tables) est atteinte avant.

En dessous de 800px de largeur de fénêtre, les colonnes sont trop étroites pour une lecture agréable.
Il faudrait alors envisager une AUTRE mise en page... ce que l'utilisation de <table> rend fastidieux, pour ne pas dire impossible.

[johnrock]

Je suis suis entièrement d'avis avec jreaux. Je pense qu'utiliser les <table> était une erreur de ta part, mais bon...

La solution que j'apporte n'est pas si loin de celle de jreaux.

En analysant ta page, j'ai vu que tout ton container est une div d'id al et tous les width sont en pourcentage (ce qui nous favorise ici). donc tu dois définir un taille précise en pixel de #ul

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
#al
{
width: taille quelconque;
}

Je préférerai que ta taille soit soit = ou < à 1000px pour l'adaptation à pas mal d'ordinateurs , vu que ton site n'est pas responsive .

Je pense que ça t'aidera.