Probleme positionnement d'un form [Résolu]

Signaler
Messages postés
353
Date d'inscription
samedi 11 décembre 2010
Statut
Membre
Dernière intervention
29 juin 2011
-
Messages postés
353
Date d'inscription
samedi 11 décembre 2010
Statut
Membre
Dernière intervention
29 juin 2011
-
Bonjour à tous je cret un site web et je voudrais que mon form principal soit centrer sur la page et puisse s'adapter a tous les tailles et résolutions d'écrans.
J'ai trouver que l'on pouvait utiliser width : 100% pour que quel que soit l'écran la largeur fasse toujours 100% de l'écran.
J'ai essayer mais rien ne s'affiche.
Mon form ne s'affiche que si je met une donnée en px pour width.
Donc je voudrais savoir comment faire pour centrer mon form et l'adapter à tous les écrans ( largeur et longueur)
J'éspère avoir été assez claire et d'avances merci pour vos réponses.

11 réponses

Messages postés
353
Date d'inscription
samedi 11 décembre 2010
Statut
Membre
Dernière intervention
29 juin 2011

Ba sa marche pas, je sais pas
Messages postés
6063
Date d'inscription
dimanche 13 avril 2003
Statut
Modérateur
Dernière intervention
15 juillet 2011
28
Salut,
Il ne faur pas gérer au niveau de ta form mais des divs
Tu fais
une div contenu
avec par exemple une div header une div colgauche une div centre une div droite une div footer
apres tu remplis chaque zone avec des div
et tu geres les tailles en CSS et/ou javascript- moins recommandé

Bon courage 
Messages postés
249
Date d'inscription
samedi 13 octobre 2007
Statut
Membre
Dernière intervention
2 mai 2014

Bonjour

oui c'est exactement comme t'a expliqué nhervagault moi aussi je préfère la mise ne page en utilisant les divs et les tableaux pour les formulaires, je vais juste ajouter que pour ton problème de résolution d'écrans jusqu'à maintenant j'ai tombé sur deux solutions en utilisant les css la première c'est en utilisant les divs avec les width et les height en pourcentage et en utilisant le padding et le margin mais là le problème c'est la compatibilité multi navigateur tu aura un affichage inattendu d'un navigateur à un autre c'est sûr, la deuxième est celle qui m'a toujours arrangée en testant sur tout les navigateurs c'est le positionnement absolu tu utilise l'attribut position : absolute  avec les attributs top, bottom, right, left avec width et height en pourcentage ou en pixel voilà c'est une méthode que personnellement j'utilise et qui me pose pas des problèmes sur les navigateurs même mon dernier projet qui utilise cette méthode je l'ai testé avec google chrome le dernier navigateur de google et j'ai eu un affichage correcte certes la perfection n'existe pas mais c'est acceptable (sur plusieurs résolutions).

c'est sûr à chaque méthode des avantages et des inconvénients et le besoin reste ton roi.  


Les fins justifient les moyens_________________________________________________
Yassine BENNANI - Ingénieur en génie logiciel & multimédia (Consultant SI)
Messages postés
353
Date d'inscription
samedi 11 décembre 2010
Statut
Membre
Dernière intervention
29 juin 2011

Ok merci à tous je test et je vous
Messages postés
353
Date d'inscription
samedi 11 décembre 2010
Statut
Membre
Dernière intervention
29 juin 2011

Pour ta deuxieme methode jacksparoow le code css si j'ai bien compris serait :
#divcontenu
{
position : absolute;
width : 80%;
height : 100%;
}

Par contre je dois mettre quoi pour top, bottom, right, left?
(J'ai deja essayer position : absolute; width : 80%; height : 100%; mais il ne m'affichait rien)Il ne m'affichait que le div si je mettait une donnée en px pour height.

[../auteur/JACKSPAROOW/1172897.aspx ]
Messages postés
353
Date d'inscription
samedi 11 décembre 2010
Statut
Membre
Dernière intervention
29 juin 2011

Non finalement sa a marcher.
Merci à tous
Messages postés
133
Date d'inscription
mercredi 27 juin 2012
Statut
Membre
Dernière intervention
10 janvier 2012
1
salut Hugo,

margin:auto;
width:640px;
height:480px;
position:relative;
a bientot
ensuite, ton 2 eme div, tu le met dans le div pricipal en absolute
++
Messages postés
353
Date d'inscription
samedi 11 décembre 2010
Statut
Membre
Dernière intervention
29 juin 2011

J'ai un probleme lorsque je met mes données en % le margin :auto marche pas , mais il marche quand je les mets en px.
Pouriez-vous m'aider.
Messages postés
353
Date d'inscription
samedi 11 décembre 2010
Statut
Membre
Dernière intervention
29 juin 2011

Non en fait j'ai tous inverser je vous redit mon probleme :

Il me semble que pour que le margin : auto marche il faut que je mette position : relative.
Mais si je met position : relative height  : 100% marche plus , il marche si position : absolute.
Donc comment faire pour avoir des des height et width en % et un margin : auto qui marche
Messages postés
249
Date d'inscription
samedi 13 octobre 2007
Statut
Membre
Dernière intervention
2 mai 2014

Bonjour

Moi je vais parler juste des heights en pourcentage le margin auto je l'utilise pas je préfère toujours le fixer en tous cas pour le width en 100% là je pense pas qu'il ya un problème mais le heigth en 100% c'est là le problème c'est un bug je ne sais pas il est à quel niveau mais bon pour le fixer il faut appliquer d'abord la régle de height : 100% sur la balise body et html pour que le height en 100% appliqué sur un div marche.

html

,
body{

margin:
0;

padding:
0;

height:
100%;

width:
100%;
}

Les fins justifient les moyens_________________________________________________
Yassine BENNANI - Ingénieur en génie logiciel & multimédia (Consultant SI)
Messages postés
353
Date d'inscription
samedi 11 décembre 2010
Statut
Membre
Dernière intervention
29 juin 2011

D'acord j'acksparoow je test et je vous tiens au courant (je suis toujours preneur pour une autre réponse)