Pble de liens dans un tableau qui glissent vers la gauche !!

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !
allain47

Pble de liens dans un tableau qui glissent vers la gauche !!

Message par allain47 »

Bonjour à tous,

Sur ma site perso ( http://a.clt.free.fr/ ), j ai un tableau de 9 cases. Dans chaque case, un lien.

Lorsque je clique sur un lien, tout le tableau "glisse" de quelques centimetres sur la gauche !! c'est incomprehensible. Alors je dois avec le souris reclicker sur le lien à la nouvelle position, et là ca marche.

J ai navigué sur mon site avec Internet Explorer, et ca ce le fait pas. Il n y a qu avec FF 2.

Pour info, le site utilise CSS mais cela ne devrait rien à voir.

Quelqu'un pourrait il me renseigner sur ce pble très bizarre.


Alain.Lot et garonne.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.2) Gecko/20070219 Firefox/2.0.0.2
Avatar de l’utilisateur
Mori
Animal mythique
Messages : 13311
Inscription : 30 avr. 2004, 19:17

Message par Mori »

salut,
un problème dans la définition de width http://www.yoyodesign.org/doc/w3c/css2/ ... h-property ?

Linux Salix OS 15.0 / Xfce 4.16

SB
Varan
Messages : 1095
Inscription : 05 mars 2004, 18:38

Message par SB »

Ça glisse mais le lien fonctionne, il n'y a pas besoin de recliquer.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 6.0; fr; rv:1.8.1.2) Gecko/20070219 Firefox/2.0.0.2
alain47
Arias
Messages : 18
Inscription : 03 mars 2007, 11:42

Message par alain47 »

Mori a écrit :salut,
un problème dans la définition de width http://www.yoyodesign.org/doc/w3c/css2/ ... h-property ?
Merci. je vais voir le width. dans le tableau, a priori, il ny a pas d erreur de syntaxe en html.

Dans mon fichier CSS , ca commence comme ca :
*****
BODY
{background-image:url('Images/texture.gif');}

.default
{font-family:bradley hand ITC; font-weight:bold; font-size:13pt; color:#0080C0;
position:absolute; top:15%; left:15%; right:15%; text-align:justify;}

.home_top
{position:absolute; top:5%; left:10%;}
.home_middle
{position:absolute; top:48%; left:10%;}
.home_bottom
{position:absolute; top:75%; left:10%;}
*****

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.2) Gecko/20070219 Firefox/2.0.0.2
alain.
Gil225
Lézard vert
Messages : 165
Inscription : 15 févr. 2007, 12:59

Message par Gil225 »

on fait toujours en général un <Table width =100 %..... pour recadrer les pages en fonction des internautes qui utilisent une résolution différente

c'est peut-être cela ton problème de décalage enfin je pense 8-)

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.2) Gecko/20070219 Firefox/2.0.0.2
alain47
Arias
Messages : 18
Inscription : 03 mars 2007, 11:42

Message par alain47 »

Mori a écrit :salut,
un problème dans la définition de width http://www.yoyodesign.org/doc/w3c/css2/ ... h-property ?

NB : pour les liens, mon fichier CSS est le suivant :

*****
a:link
{font-family:bradley hand ITC; font-weight:bold; font-size:13pt; color:#0080C0}
a:visited
{font-family:bradley hand ITC; font-weight:bold; font-size:13pt; color:#0080C0}
a:active
{font-family:bradley hand ITC; font-weight:bold; font-size:13pt; color:#0080C0}
a:hover
{font-family:bradley hand ITC; font-weight:bold; font-size:13pt; color:#0080C0; text-decoration:none;}
/* liens pour page de garde; Pour les liens des pages interieures : utilisation de 'H3' */
****

Le pble peut il venir des liens ?



Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.2) Gecko/20070219 Firefox/2.0.0.2
alain.
Avatar de l’utilisateur
Mori
Animal mythique
Messages : 13311
Inscription : 30 avr. 2004, 19:17

Message par Mori »

[Modération]
je déplace dans la bonne section.

Linux Salix OS 15.0 / Xfce 4.16

alain47
Arias
Messages : 18
Inscription : 03 mars 2007, 11:42

Message par alain47 »

Mori a écrit :salut,
un problème dans la définition de width http://www.yoyodesign.org/doc/w3c/css2/ ... h-property ?
**************

Je viens de lire le lien : il semble que ma situation corresponde exactement au CONTENEUR et notamment les flottants.
Je vais revoir tout ca ce soir.

Mais ce qui est etonnant, c'est que seul FireFox soit concerné (et pas IE).

Merci à toi, Mori.

*************


Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.2) Gecko/20070219 Firefox/2.0.0.2
alain.
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

alain47 a écrit :Mais ce qui est etonnant, c'est que seul FireFox soit concerné (et pas IE).
Quid des autres ? Opera, Konqueror... ?

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.2) Gecko/20070220 Firedragon Firefox/2.0.0.2
alain47
Arias
Messages : 18
Inscription : 03 mars 2007, 11:42

Message par alain47 »

Gil225 a écrit :on fait toujours en général un <Table width =100 %..... pour recadrer les pages en fonction des internautes qui utilisent une résolution différente

c'est peut-être cela ton problème de décalage enfin je pense 8-)

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.2) Gecko/20070219 Firefox/2.0.0.2

Je viens de me remettre sur mon ouvrage. J'ai mis WIDTH à 100 % au lieu 90 % dans mon tableau <TABLE> et ... ca marche. Effectivement, le pble vient de là.

Mais je ne comprend pas pourquoi.

Losque je fais un tableau genre <table width="90%"> , je veux un tableau de 90 % de large , par rapport à la largeur de la page (donc de <body>).

Or, avant ma modif, à chaque fois que je cliquer sur un lien du tableau, cela faisait comme si ca reprenait 90 % de 90 %, puis si je recliquais , ca refaisait 90% de 90% de 90% ... donc à chaque fois, ca me faisait retrecir l'emplacement du tableau de 10 % à chaque click !

Je vais quand meme voir si je ne peux pas remettre à 90 % mais en mettant un fixe quelquepart au lieu d'avoir un conteneur flottant ... à voir.

Merci Gil.


(N.B. : Pour repondre à Calimo, je n'ai pas essayé sur d'autre navigateur.)
alain.
alain47
Arias
Messages : 18
Inscription : 03 mars 2007, 11:42

Message par alain47 »

et voila la fin du pble.

Je me disais quand meme que ce n'est pas l'odinateur à me dire de mettre un tableau de 100 % alors que je veux un tableau de 90 % de large ! Non mais, c'est qui le chef enfin ! :-)

Alors j'ai repris ma lecture de ma doc (plusieurs livres de micro-application e-poche qui datent de 2001 ! sur le DOM et le CSS, pour laisser mon ordi se refroidir) et effectivement, comme le disait ..., le probleme venait bine du WIDTH.

J'ai donc modifié mon fichier CSS : le tableau qui "bougeait" était entouré de <div class="home_middle"> </div> . et ma feuille de style concernant la class="home_middle" comportait la carctéristique "position:absolute" MAIS SANS WIDTH de préciser , et voilà où etait mon erreur.

J'ai donc ajouter "width:90%" aux caracteristiques de la classe "home_middle" .. et maintenant mon tableau de 90 % sur ma page HTML de garde, marche tout à fait normalement maintenant.

LE PBLE EST RESOLU.

J'espère que cette petite mésaventure pourra servir aux internautes/webmestre.

Bye à tous et merci aux deux internautes qui m'ont aidé.



Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.2) Gecko/20070219 Firefox/2.0.0.2
alain.
HP
Tyrannosaurus Rex
Messages : 2196
Inscription : 21 oct. 2004, 10:25

Message par HP »

alain47 a écrit :Alors j'ai repris ma lecture de ma doc (plusieurs livres de micro-application e-poche qui datent de 2001 !
[...]
J'espère que cette petite mésaventure pourra servir aux internautes/webmestre.
ouais, ça se sent que ta doc n'est plus toute fraîche... parce que la mise en page en tableaux, aujourd'hui, cette absurdité est abandonnée par tout le monde (ou presque), et c'est beaucoup plus facile ainsi.

[EDIT] coquilles

Message envoyé avec : Mozilla/5.0 (Macintosh; U; Intel Mac OS X; en-US; rv:1.8.1.3pre) Gecko/20070303 Firefox/2.0.0.3pre (Mac Community Build, ElFurbe)
Dernière modification par HP le 04 mars 2007, 13:21, modifié 1 fois.

“La médiocrité obtiendra immanquablement la préséance en se travestissant des oripeaux de la bienséance.”
Invité

Message par Invité »

HP a écrit : ouais, ça se sent que ta doc n'est plus toute fraîche... parce que la mise en page en tableaux, aujourd'hui, cette absurdité et abandonné par tout le monde (ou presque), et c'est beaucoup plus facile ainsi.

Message envoyé avec : Mozilla/5.0 (Macintosh; U; Intel Mac OS X; en-US; rv:1.8.1.3pre) Gecko/20070303 Firefox/2.0.0.3pre (Mac Community Build, ElFurbe)
Tu as surement raison mais lorsque tu as 9 liens à mettre dans page d'accueil sous la forme que j ai choisie, il m'a semblé plus facile et spontané d'utiliser un tableau.
Mais que me recommanderais-tu à la place du tableau (en ayant la meme configuration des 9 liens bien sur) ?
Je reste ouvert à toute solution alternative, aussi efficace.
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

Aujourd'hui on utilise les CSS (cascading stylesheets). Cela permet de séparer le contenu et la mise en forme, c'est donc nettement mieux :-) (maintenance plus aisée, code plus léger etc.)
Il y a plein de tutos sur le net, par exemple :
http://www.siteduzero.com/tuto-3-6-0-ap ... e-web.html
:wink:

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.2) Gecko/20070220 Firerenard Firefox/2.0.0.2
nico@nc
Animal mythique
Messages : 8038
Inscription : 21 août 2005, 08:04

Message par nico@nc »

Les CSS (cascading stylesheet = "feuille de style en cascade") !


aie... j'ai pas de p'tit lien qui passe bien à coller là... bon : http://css.alsacreations.com/ et sur http://openweb.eu.org/ (il y a quelques articles, peut-être pas tout récents...) ;)

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.2) Gecko/20070220 Firefox/2.0.0.2
Nicolas
☛ Problème [résolu] ? Modifiez votre premier message pour l'indiquer.
Pas de support par message privé, postez sur le forum, merci.
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Semrush [Bot] et 1 invité