Site sous Mozilla/Firefox

Fermé
poky17 Messages postés 53 Date d'inscription lundi 26 mars 2007 Statut Membre Dernière intervention 30 mars 2008 - 27 mars 2007 à 20:37
RAD ZONE Messages postés 5230 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 17 août 2024 - 16 juil. 2007 à 21:52
Bonsoir,

Ah j'étais toute contente d'être arrivée à faire une feuille de style correcte pour mon formulaire grâce à Gihef et voilà que je consulte le site de mon boulot sous Mozilla et là toutes les cases du formulaire sont mal placées.
J'ai trop les boules.
Y'a t-il un moyen pour remédier à cela et que ça fonctionne sur tous les navigateurs.
Merci à tous de votre contribution.
CN
A voir également:

11 réponses

txiki Messages postés 6596 Date d'inscription mercredi 30 janvier 2002 Statut Contributeur Dernière intervention 22 février 2024 517
27 mars 2007 à 21:38
Salut poki,
et si tu nous donnais l'url du site ????
qu'on voit ce qui se passe ?
0
poky17 Messages postés 53 Date d'inscription lundi 26 mars 2007 Statut Membre Dernière intervention 30 mars 2008
27 mars 2007 à 22:12
ok désolée c'est parti

http://legarrit.free.fr/reservation.php/
Merci beaucoup
0
txiki Messages postés 6596 Date d'inscription mercredi 30 janvier 2002 Statut Contributeur Dernière intervention 22 février 2024 517
27 mars 2007 à 23:09
Salut poky17,
Je t'ai envoyé le formulaire avec du speetch....

Si tu veux, je peux te filer un CSS pour les pages et du même coup, pour ton formulaire (sa mise en forme quoi).

Un p'tit souci: il faut deviner qu'il y a du contenu en dessous du formulaire. Tu devrais séparer ça en plusieurs pages avec un menu dynamique (j'ai aussi un script comme celui-ci peut-etre): http://www.chalvidant.com/
Je parle du menu uniquement bien sur ! A adapter a ta jolie page. Super look !
0
poky17 Messages postés 53 Date d'inscription lundi 26 mars 2007 Statut Membre Dernière intervention 30 mars 2008
28 mars 2007 à 00:47
ok merci pour tous ces conseils. Et c'est vrai que tu trouves la page jolie ?
Par contre , tu dis m'avoir envoyé un speech avec le formulaire, mais où ? je n'ai rien reçu.
J'ai pas trop compris l'histoire du menu et du contenu sous le formulaire.
Merci
CN
0
txiki Messages postés 6596 Date d'inscription mercredi 30 janvier 2002 Statut Contributeur Dernière intervention 22 février 2024 517
28 mars 2007 à 04:19
Ben j'ai rempli le formulaire et le speetch est dans la partie texte (textarea) puis j'ai fait "Envoyer". C'est tout.
Oui, ta page est super jolie ! ;-)
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Salut,

Eh oui, mais malheureusement, c'est un autre problème évoqué sur le forum et qui est en cours de résolution. Si l'on ne remplit pas toutes les données du formulaire, les données ne sont pas enregistrées, donc je n'ai rien reçu.
Désolée.
Merci encore.
CN
0
txiki Messages postés 6596 Date d'inscription mercredi 30 janvier 2002 Statut Contributeur Dernière intervention 22 février 2024 517
28 mars 2007 à 10:42
Salut poky,
Et si tu met un <br /> a la fin des input ? Normalement faudrait !
A moins que tu les mettent (inputs) entre <p> et </p> auquel cas c'est un paragraphe donc de type bloc, donc retour à la ligne avec saut de ligne normal.
Le br c'est pour un retour à la ligne moindre.
par contre pour ton truc des champs renseignés, ça c'est bizarre ???? Normalement c'est plutôt l'inverse, càd qu'on doit dire que tel champ est obligatoire avec un controle en javascript.
0
poky17 Messages postés 53 Date d'inscription lundi 26 mars 2007 Statut Membre Dernière intervention 30 mars 2008
29 mars 2007 à 00:06
Salut,

Bon il y a bien des <br /> à la fin des Input, alors je ne sais pas quoi dire.
Et pour le formulire idem.
Merci
CN
0
txiki Messages postés 6596 Date d'inscription mercredi 30 janvier 2002 Statut Contributeur Dernière intervention 22 février 2024 517
29 mars 2007 à 08:04
Salut poky,
Eh bien je viens d'aller sur ton site et ...... les champs ne se touchent plus. Ils sont tous alignés à gauche.
Dommage pour ton menu, cette page est conçue comme une un listing avec les menus entre les différents chapitres.
Remarque:
pour aligner les champs, tu pourrait mettre des   (c'est le caractère espace en html, autrement dit, tu force le navigateur a afficher un/plusieurs espaces).
ex:
<p>Nom:&nbsp;&nbsp;&nbsp;<input type="text" name="nom" etc......></p>

Soit tu met ces caractères avant le mot nom: soit après. Comme ça tu aurais les intitulés à gauche et les champs alignés les uns par rapport aux autres.
AUTRE CHOSE: (face="monotype corsiva") dommage car ceux qui n'ont pas cette police sur leur PC, se voient afficher le texte en times (chez moi par exemple). Faut éviter de mettre des polices fantaisites mais plutôt comme ceci: Arial, Helvetica, sans-serif
ce qui veut dire que d'abord le navigateur affichera en arial (si le police existe sur la machine client, sinon, en helvetica etc...


0
poky17 Messages postés 53 Date d'inscription lundi 26 mars 2007 Statut Membre Dernière intervention 30 mars 2008
29 mars 2007 à 10:03
Salut txiki,

Ok pour les polices, je pense les changer effectivement.
Par contre, pour l'affichage du formulaire, je crois que je vais devenir folle !!!
Alors chez moi, sur IE, il s'affiche correctement et sous mozilla les champs sont alignés à gauche, mélangés avec les intitulés.
Si j'applique les espaces, ça pourrait marcher sous mozilla mais ça me fait des bêtises sous IE. Ou alors, je laisse et tant pis pour Mozilla mais c dommage pour ses utilisateurs.
Je n'y comprends plus rien, voici un extrait du code du formulaire ainsi que la feuille de style du formulaire.
Merci.
CN
label>Nom: </label>
<input type="text" name="nom" size="30" /><br />
<label>Prénom: </label>
<input type="text" name="prenom" size="30" /><br />
<label>Adresse : </label>
<input type="text" name="adresse" size="30" /><br />
<label>Code postal : </label>
<input type="text" name="codepostal" size="30" /><br />
<label>Ville : </label>
<input type="text" name="ville" size="30" /><br />
<label>Département : </label>
<input type="text" name="dep" size="30" /><br />
<label>N° de téléphone : </label>
<input type="text" name="tel" size="14" maxlength="14" value=""><br />
<label>e-mail : </label>
<input type="text" name="email" size="30" /><br />
<label>Site perso : </label>
<input type="text" name="site" size="30" /><br />
</fieldset>

<p class="titre">Infos</p>
<p id="civilite"><label>Connaissez-vous notre région ? </label>
<input type="radio" name="yes" value=1 />Oui.
<input type="radio" name="yes" value=2 />Non.
</p>

<p class="titre">Message</p>

<fieldset id="message">
<textarea name="com" rows="5" cols="40"></textarea>
</fieldset>
<p id="buttons">
<input type="submit" value="Envoyer" />
<input type="reset" value="Recommencer" />
</p>
</form>





form#reserver {
position : relative;
}

p.titre {
background:#FFFFCC;
color:purple;
padding:.2em .3em;
font-family:Tahoma, Arial, Helvetica, sans-serif;
font-size:1em;
border:2px outset purple;
position:relative;
margin-bottom:-1em;
width:10em;
margin-left:1em;
margin-top:1em;
}

fieldset {
background:#FFFFCC;
border:outset purple;;
font-family:Tahoma, Arial, Helvetica, sans-serif;
margin-bottom:1em;
width:30em;
padding-top:1.5em;
}

#coordonnees label {
position:absolute;
font-size:90%;
padding-top:.2em;
left:15px;
}

#coordonnees input {
margin-left:-2em;
line-height:1.4em;
margin-bottom:.2em;
}

/* fieldset message */
fieldset#message {
height:15em;
}

#civilite {
font-size:95%;
}

#civilite input {
margin-left:9em;
}

#civilite input + input {
margin-left:1em;
}

/* zone de texte du message */
textarea {
font:.8em "Tahoma, Arial, Helvetica, sans-serif";
width:35em;
height:15em;
padding:.2em;
margin-left:-13em;
}

/* les boutons submit et reset */
input[type="submit"], input[type="reset"] {
background:#FFFFCC;
font-family:Tahoma, Arial, Helvetica, sans-serif;
font-size:1em;
color:purple;
}

p#buttons {
text-align:center;
}
0
txiki Messages postés 6596 Date d'inscription mercredi 30 janvier 2002 Statut Contributeur Dernière intervention 22 février 2024 517
29 mars 2007 à 21:45
Salut poky17,
Bon, je viens de copier/coller tes bouts de codes et de faire des tests.
Ta feuille de style m'a l'air bien compliquée, aussi je te l'ai modifiée en laissant les commentaires et les anciens paramètres en commentaires aussi.
Les voici:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="scripts_styles/test.css" type="text/css" rel="stylesheet">
<title>Document sans titre</title>
</head>

<body>
<table width="60%" align="center" cellspacing="0" cellpadding="4"><tr><td>
<form name="reserver" id="reserver" acton="#">
<fieldset>
<p><label>Nom:&nbsp;&nbsp;&nbsp;&nbsp;</label><input type="text" name="nom" size="30" /></p>
 <p><label>Prénom: </label><input type="text" name="prenom" size="30" /></p>
  <p><label>Adresse : </label><input type="text" name="adresse" size="30" /></p>
  <p><label>Code postal : </label><input type="text" name="codepostal" size="30" /></p>
  <p><label>Ville :&nbsp;&nbsp;&nbsp;&nbsp; </label><input type="text" name="ville" size="30" /></p>
  <p><label>Département : </label><input type="text" name="dep" size="30" /></p>
  <p><label>N° de téléphone : </label><input type="text" name="tel" size="14" maxlength="14" value=""></p>
  <p><label>e-mail :&nbsp;&nbsp;&nbsp;&nbsp; </label><input type="text" name="email" size="30" /></p>
    <p><label>Site perso : </label><input type="text" name="site" size="30" /></p> 
</fieldset>

 <p class="titre">Infos</p>
 	<p id="civilite"><label>Connaissez-vous notre région ? </label>
	<input type="radio" name="yes" value=1 />Oui.
	<input type="radio" name="yes" value=2 />Non.
 	</p>
<p class="titre">Message</p><br />

<p><fieldset id="message"><textarea name="com" rows="5" cols="40"></textarea></fieldset></p>
<p id="buttons"><input type="submit" value="Envoyer" /><input type="reset" value="Recommencer" /></p>
</form>
</td></tr></table>
</body>
</html>
Puis ta CSS:
/* ---------------------------------------------------------- */
/* feuille de style pour le formulaire qui merde sous IE
/* Ta feuille de style m'a l'air bien compliquée.... quand même 
/* ---------------------------------------------------------- */

table { /* aspect du tableau, de son padding, taille police etc... */
	padding: 8px; /* pixels préférable pour le texte à partir du bord */
	font-size: 0.8em;
	border: 1px none #000000; /* ici, pas de bordure noire mais peut utiliser solid, dashed etc... */
	/*dashed = tirets */
	/* solid = trait continu */
	/* none = pas de bordure */
	}
	
#reserver { /* au lieu de : form#reserver */
  position : relative;
  }

p.titre { /* ***  */
	background: #FFFFCC;
	color: purple;
	padding: .2em .3em; /* toujours ce point devant la valeur, m'étonnerais que ça marche ? ou alors c'est 0.2em ?*/
	font-family: Arial, Helvetica, sans-serif; /* en virant le tahoma qui est très petit chez moi */
/*	font-size: 1em; /* chez moi, c'est grand comme affichage (1024 x 768) même pour un titre. C'est plus "propre" comme ça non ? */
	font-size: 1.2em; /* a cause de l'arial. Faut tester avec plusieurs polices */
	border: 2px outset purple;
	position: relative;
	margin-bottom: -1em;
	width: 10em;
	margin-left: 1em;
	margin-top: 1em;
}

fieldset { /* je trouve que les couleurs ne sont pas très "heureuses" */
	background: #FFFFCC;
	border: outset purple;;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	margin-bottom: 1em;
/* width:30em; */ /* inutile: tu l'a déjà mis dans size="30" de tes input */
	padding-top: 1.5em;
}

#coordonnees label {
	position: absolute;
	font-size: 90%; 
	padding-top: 2em; /* tu a mis un point devant 2em (???) */
/* left: 15px; */ /* inutile si tu met un padding dans "table" ou "#form" par exemple */
}

/* #coordonnees input {
	margin-left: -2em;
	line-height: 1.4em;
	margin-bottom: 2em; 
} 
ici, je ne comprend pas */


/* fieldset#message { 
height:15em;
}
*/

#civilite { /* pas grande utilité, il s'aligne à gauche sous Firefox */
	font-size: 95%; 
	margin-left: 20px; /* je te l'ai remis ici mais évite les em pour positions. */
	font-family: Verdana, Arial, Helvetica, sans-serif;
} 

#civilite input { /* que fait-il ? doublon avec ci-dessus, pourquoi pas groupir? */
	margin-left: 9em; /* voir ci-dessus */
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

/* c'est quoi ça ? encore doublon avec ci-dessus. Soit tu applique a input soit tu crée un id civilité mais les 2..... ?
#civilite input + input { 
margin-left:1em;
} */


textarea { /* zone de texte du message */
	font: 0.8em "Tahoma, Arial, Helvetica, sans-serif"; /* t'a oublié le family (font-family) */
/*	width: 35em; /* vaut mieux utiliser les % pour les width, un conseil, essaie de ne pas fixier les largeurs */
	width: 95%; /* attention, c'est 95% de la table qui, elle en fait 60%, on pourrait aussi bien mettre 100% */
	height: 15em; /* sache que le em est une valeur "relative", des fois vaut mieux le px (pixel) */
	padding: 8px;
/*	padding: .2em; /* encore un point devant la valeur ??? décidément ! et 2em, ça fait beaucoup non ? */
	margin-left: 5px; /* chez moi il est assez bien centré comme ça */
/*margin-left:-13em; /* très mauvais, crée la zone à l'extérieur du fond jaune et de son cadre ??? */
}


input[type="submit"], input[type="reset"] { /* les boutons submit et reset */
background:#FFFFCC;
font-family:Tahoma, Arial, Helvetica, sans-serif;
font-size:1em;
color:purple;
}

p#buttons {
text-align:center;
}

Sous Firefox en tous cas, ça ne fonctionnait pas du tout. C'était vraiment décalé. Rien à sa place.
Quand j'aurais un peu plus de temps, j'essaierai de voir avec toi si on peut améliorer ça.
Bon courage !
0
Bonjour, moi aussi j'ai un soucis avec mon site sous mozilla. Sous IE aucun problème. J'ai fait un tableau sans bordure et sous mozilla il me mets des bordures n'importe où : http://dvif.fr/index.php
Attention ce site est en contruction je n'ai pas fini de tout améliorer et tout construire. Merci d'avance j'attends vos solution avec impatience ^^
0
RAD ZONE Messages postés 5230 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 17 août 2024 1 360
16 juil. 2007 à 21:52
SALUT Flofly

Attention ce site est en contruction je n'ai pas fini de tout améliorer et tout construire

oui mais la , c est deja un miracle qu elle s ouvre , a la vue du code il faut d abord corriger ta page des erreurs les plus importantes ( et il en as ;-)!!) quelques pistes !!

tu as des meta dans un des nombreux <html> </html> corrige ces 2 erreurs ainsi que les <head> </head> multi aussi !! et cela vas deja etres du boulot sans oublier les <.....> et </.....> manquant a plusieurs endroit !! mais si tu veut que l ont se penche sur ton probleme il faut au moins voir ces parties,pour que la solution s adapte correctement !!

RAD !
0