Décalage vers le bas des formulaires

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 !
Scaler

Décalage vers le bas des formulaires

Message par Scaler »

Bonjour,

Voilà, comme indiqué dans le sujet, j'ai quelques soucis au niveau de l'affichage des formulaires.
En fait, cela se traduit soit par une augmentation des marges lorsque l'on sélectionne un titre grâce un formulaire de type "select", soit par un décalage de tout le formulaire vers le bas, lorsque l'on tente de cliquer sur le bouton submit... Il faut donc cliquer à nouveau sur le bouton submit pour que le formulaire soit envoyé.

Le problème semble venir des marges intérieures autant qu'extérieures... Dans certains cas, en mettant les propriétés margin et padding à 0px pour les "input" et "select" cela peut règler le problème ; mais dans le cas qui me préoccupe, cela ne fonctionne pas.

De plus, sous IE, il n'y a aucun problème, ce qui m'agace profondément :P.

J'espère que vous saurez répondre à mes petites interrogations.. Merci.

@ bientôt.
FF_Olivier
Iguane
Messages : 979
Inscription : 09 juil. 2004, 15:41

Message par FF_Olivier »

On peut avoir une URL ? Ou le code de la page ? Du concret, quoi...
openSUSE 12.2 - FF v24.0 FR - TB v24.0 FR ma config en détails - Décrivez la vôtre ici ;)
userContent.css : modifiez l'apparence et le contenu des sites visités !
Scaler

Message par Scaler »

Bien entendu :P Je pensais qu'une description aussi précise suffirait :lol: !

Code : Tout sélectionner

<form method="post">
		<fieldset>
			<legend> Type d'images </legend>
		<p><select name="type">
				<option value="wallpapers">Wallpapers</option>
		<?php
		$qtype = mysql_query('SELECT * FROM `numarticles` ORDER BY `articles`');
		while($rtype = mysql_fetch_array($qtype))
		{
		  echo '<option value="'.$rtype['id'].'">'.$rtype['articles'].'</option>';
		}
		?>
		 </select><input type="submit" value="valider" /></p>
		</fieldset>
	</form>
Voici notamment un le code que j'utilise pour une des formulaires de sélection. Dans celui-ci, le problème est donc que les marges augmentent de manière incompréhensible.

Dans le cas d'un input, c'est tout le formulaire qui descend ...
C'est un problème récurrent que j'ai constaté sous mozilla avec les formulaires, ainsi que certains webmasters avec qui je bosse.

Je précise que préciser l'attribut "action" ne change rien au problème.

@+[/code]
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

Le tout c'est qu'avec toutes les belles descriptions que tu peux faire ou avec tous les bouts de codes qu'on peut avoir (sachant que le php n'a rien à voir avec Firefox), rien ne remplace une démonstration "grandeur nature"... :roll:
Scaler

Message par Scaler »

Le problème n'est malheureusement pas lié au php. Si vous ne voyez pas ce à quoi je fais référence, c'est que vous n'y avez pas été confronté.

J'ai déjà testé un bon nombre de choses. Cela se situe peut être au niveau d'une règle précise à adopter pour la construction des formulaires sous mozilla.

Cependant, si vous y tenez, ce site en construction peut vous permettre de mieux appréhender le problème.
http://www.onirique.host-gratuit.net/tz ... diger_news

Désolé si le chargement est un peu long, je n'ai pas encore alléger les pages ni les images.

@ bientôt.

PS : si vous appuyez sur le bouton submit même sans remplir les champs, normalement vous devriez voir le formulaire descendre...
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

Effectivement... il doit y avoir au moins une dizaine de bugs ouverts à ce sujets sur Bugzilla. J'avais récemment vu des choses qui finalement n'étaient pas très très différentes, mais c'était avec des <select> dont la hauteur avait été fixée, dans une <table>, qui changeait de largeur au clic. Là c'est pas pareil mais ça y ressemble... :? (mais j'ai rien trouvé qui corresponde exactement...)
Scaler

Message par Scaler »

C'est déjà sympa d'essayer de répondre. En fait, je pense que c'est dû au fait que les marges et dimensions de ces éléments sont pré-définis par le navigateur. Sous IE, le problème ne se pose guère.

Cependant, je ne vois pas ce qu'il est possible de faire sinon passer tous les éléments du formulaire en revue pour définir manuellement toutes les dimensions, mais une fois encore, cela ne fonctionne pas toujours.

Certaines solutions fonctionnent une fois sur deux, on se demande pourquoi.. Comme le fais de mettre les marges à 0.

@+

PS : si quelqu'un a l'ombre d'une solution.
Scaler

Message par Scaler »

Je tiens simplement à préciser que j'ai réussi à trouver un début de solution en collant la balise form et la balise fieldset de cette manière :

Code : Tout sélectionner

<form method="post"><fieldset>
       <legend>titre<legend>
       etc......

Je sais, ça parait idiot, mais cela n'entraine pas de décalage du formulaire à la sélection ou au submit...

Bonne continuation.
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 3 invités