Sujet Précédent Sujet Suivant

Centrer une image quelque soit la résolution ou le navigateur.

mquisuisje Messages postés 10 Date d'inscription mardi 2 mars 2004 Statut Membre Dernière intervention 20 mai 2009 - 20 mai 2009 à 14:22
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 - 21 mai 2009 à 00:29

A voir également:

Centrer une image quelque soit la résolution ou le navigateur.
Convolution image - Conseils pratiques -Java
Form image ✓ - Forum Visual Basic
Une image .tiff repose sur une palette de 256 000 couleurs. - Forum C / C++ / C++.NET
Inverser les couleurs d'une image ✓ - Forum Visual Basic 6
Palette couleur ✓ - Forum C++ & C++ .NET

4 réponses

Réponse 1 / 4

mquisuisje Messages postés 10 Date d'inscription mardi 2 mars 2004 Statut Membre Dernière intervention 20 mai 2009
20 mai 2009 à 14:51

Pour compléter: je précise que dans cette </table>, il y a 4 <td. Dans le 4ème se trouve le texte.

A+

Réponse 2 / 4

Bul3 Messages postés 4933 Date d'inscription samedi 1 juillet 2006 Statut Membre Dernière intervention 2 février 2015 16
20 mai 2009 à 15:58

Bonjour,
un ( ou une, je n'ai pas été présenté, je ne sais pas ) <table> s'adapte
     et à son contenu et à la taille de l'écran
     4 TD, déjà, on ne peut pas mettre dans le TD du milieu !
     mais en fait : pas tout à fait compris ce que tu cherches
     centrer l'image ? par rapport à la fenêtre ?
     centrer le ( ou la ) table ?

Cordialement [mon Site] [M'écrire] Bul

Réponse 3 / 4

mquisuisje Messages postés 10 Date d'inscription mardi 2 mars 2004 Statut Membre Dernière intervention 20 mai 2009
20 mai 2009 à 20:19

je reprends plus simplement, j'aimerais imposer le centrage de l'image qui apparait au passage de la vignette au centre de la fenêtre (qui si je ne me trompe pas commence par </table> ). Le problème est que si je centre pour IE, il y a un décalage pour Firefox et vice versa. De plus au niveau de la résolution l'image ne reste pas au centre de la fenêtre. Par ex sur mon écran 19" en 1280x1024 plein écran pas de problème, mais si je réduis la fenêtre l'image ne reste pas au centre de la fenêtre mais se positionne différemment suivant l'étirement. Alors que la fenêtre contenant le texte est visible entièrement. Donc je me posais la question si on ne pouvait pas imposer que l'image se centre par rapport à la fenêtre (même si celle-ci bouge lors d'un étirement ou un retrécissement du navigateur) comme ça je n'aurais plus de problème de résolution et de navigateur.

mon code est pour la position de l'image est:

<style type="text/css">

</style>

et ensuite dans
<table width="100%" border="0">
........
</tr><td..avec le texte....</td>

(cette image est invisible à l'ouverture de la page)

voilà j'espère avoir été plus claire :-)

cordialement

je suis un :-)

Réponse 4 / 4

PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
21 mai 2009 à 00:29

Bonjour,
je commence par la fin
<table bgcolor= "#e6effe" border="0" cellpadding="5" cellspacing="0" width="100%">----, voilà j'espère avoir été plus claire
:-)</td>
</td></tr></tbody></table>pas sûr !!!

<table bgcolor="#e6effe" border="0" cellpadding="5" cellspacing="0" width="100%">----, ...qui si je ne me trompe pas commence par

</td></tr></tbody></table></td></tr></tbody></table>pas exactement,
cela commence par et fini par

de ce que je vois la construction de
ta TABLE laisse à désirer, </tr><td..avec le texte....</td>, est
incorrect on devrait retrouver un truc du style...
  ----

    ,
    ,


  ----

    ,
    ,


  ----

    ,

    ,


Il
existe plusieures méthodes pour centrer dans la fenêtre d'affichage dont une,
l'alignement avec les marges negatives .

Je te livre un exemple
que j'espère te permettra de mieux cerner la méthode...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD
HTML 4.01 //EN">
<html>
<head>

<title>Alignement avec les marges negatives</title>
<meta
http-equiv ="Content-Type" content="text/html; charset=UTF-8">
<style
type="text/css">
body {
  font-family : Verdana;
  font-size :
13px;
}
td {
  text-align : center;
}
td:hover {
  color
: blue;
}
/* affichage image sur le mouseover
*/
td:hover img {
  display : inline;
  background-color
: #fff0f0;
}
/*-- Alignement avec les marges
negatives des img --*/
td img {
  display : none; /* non visible au depart */
  border : 1px solid
red;
  position : absolute; /* obligatoire
*/
  height : 200px;
  width : 400px;
  left : 50%;

  /* margin-left doit etre egale la moitie de la
largeur */
  margin-left : -200px;
}
</style>

</head>

  ----

    Ligne 1 Colonne 1,

    Ligne 1 Colonne 2,
    Ligne 1 Colonne
3,

  ----

    Ligne 2
Colonne 1,
          



         

        Survolez cette
case pour faire

        apparaître la superbe image

         

   ,

    Ligne 1 Colonne 3,


  ----

    Ligne 3 Colonne 1,

    Ligne 3 Colonne 2,
    Ligne 3 Colonne
3,



[# Affiche Image ]

</html>
nota :
- pour que le hover sur la TD fonctionne il faut un DOCTYPE
Strict de préférence.
- dans cet exemple les images doivent avoir la
même largeur, ici 400px.

Quoi dire de plus, surement plein de choses
mais, à toi de jouer...
;O)

Discussions similaires

vectoriser un logo sous photoshop

[Photoshop] : Image noir et blanc en image blanc et noir ?

image avec FPDF

initialisation du BITMAPINFO pour avoir une palette 256 couleurs!

Lancer un Navigateur web dans une application Java

Votre réponse

Discussions similaires