High-Tech Santé Médecine Droit-Finances

Auto-Entrepreneur

Comment faire ?

Rechercher : dans
Par :

Formulaire html /css

Dernière réponse le 17 avr 2008 à 20:47:56 krary, le 17 avr 2008 à 16:09:18 
 Signaler ce message aux modérateurs

Bonjour a tous,

Voila j'ai un petit souci au niveau du design de mon site web. je m'explique:

J'ai une image de fond sur laquelle je souhaiterai venir positionner deux champs d'un formulaire à des endroits bien précis.

J'ai essayer avec le css et les balises "margin-top", etc mais le problème c'est que des que je bouge la taille de ma fenêtre internet, les champs des mon formulaires se déplace au lieu de rester sur la position initial de mon image.

En espérant avoir été assez clair merci pour l'aide que vous pourrez m'apporter

Configuration: Windows Vista
Firefox 3.0

Meilleures réponses pour « formulaire html /css » dans :
Enlever le soulignement sous les liens en HTML/CSS VoirPar défaut, les liens hypertextes en HTML sont soulignés, un trait de la couleur du lien apparaît en dessous du texte. Il est possible de supprimer ce soulignement à l'aide de la propriété CSS text-decoration:none : Grâce au CSS Grâce au CSS via...
Javascript - Effacer un champ de formulaire lors du clic (focus) VoirIl vous est sûrement arrivé de tomber sur un formulaire HTML avec des valeurs pré-remplies décrivant par exemple le type de valeur attendue. L'intention est louable mais il est désagréable de devoir sélectionner ce texte et le supprimer avant de...
Créer un site beau, dynamique et respectueux des standards VoirVoici une liste de liens qui vous aideront à mieux exploiter les standards (HTML, CSS, DOM...) pour créer des sites plus beau, plus dynamiques et plus respectueux des standards. A la fin de cette page, il y a également une liste de...
Les formulaires HTML VoirIntérêt d'un formulaire Les formulaires interactifs permettent aux auteurs de pages Web de doter leur page web d'éléments interactifs permettant par exemple un dialogue avec les internaute, à la manière des coupons-réponse présents dans certains...
Servlets - Gestion des formulaires VoirIntroduction aux formulaires Les servlets rendent très simple la récupération de données envoyées par l'intermédiaire de formulaires HTML, c'est-à-dire une interface graphique permettant à l'utilisateur de saisir des données. Grâce à la balise...
Déclaration d'une feuille de style (CSS) VoirDéclaration d'une feuille de style Les feuilles de style sont un sur-ensemble du langage HTML, cela signifie qu'elle ne sont pas intégrées directement dans les recommandations HTML du W3C. Ainsi, il est nécessaire de renseigner le code HTML avec...
Posez votre question Répondre

1

Devilish, le 17 avr 2008 à 16:25:29

Comment as-tu organisé ta page?Tu as une div avec une image en fond juste pour le formulaire, ou le l'image est sur le fond du body de la page?

   
Répondre à Devilish

2

krary, le 17 avr 2008 à 16:29:27

Tout d'abord merci pour ta réponse Devilish

Pour le code, voici la partie qui pose problème (cela sera plus explicite que ma réponse!)

<body background ="images/index.jpg" style="background-repeat:no-repeat; background-position:50% -38%;">

<form name="login" method="POST" action="accueil.php">
<input type="text" name="user" value="" style="margin-top:362px; margin-left:870px; width:8%; "><br>
<input type="password" name="password" value="" style="margin-top:41px; margin-left:870px; width:8%; "><br><br>
<input type="image" src="images/join.jpg" name="image" style="margin-top:3px; margin-left:907px;" >
</form>

comme tu peut le constater, je positionne mon formulaire par rapport a ma page et donc quand je deplace ma fenetre explorer, les champ du formulaire bouge aussi.

Je ne vois pas comment je pourrait proceder

encore merci

   
Répondre à krary

3

Devilish, le 17 avr 2008 à 16:42:15

Ton image est dans ton body positionner en % et ton formulaire est positionné en px. Les positionnements en % permettent à la page de s'adapter en fonction de la dimension de la fenêtre, donc ils changent, mais pas les positionnements en pixels c'est pour ça que ça se déplace...

Essaye plutôt comme ça : 

<div background ="images/index.jpg" style="background-repeat:no-repeat; background-position:50% -38%;">
<form name="login" method="POST" action="accueil.php">
<input type="text" name="user" value="" style="margin-top:362px; margin-left:870px; width:8%; "><br>
<input type="password" name="password" value="" style="margin-top:41px; margin-left:870px; width:8%; "><br><br>
<input type="image" src="images/join.jpg" name="image" style="margin-top:3px; margin-left:907px;" >
</form>
</div>


Et changent tes position en fonction...

   
Répondre à Devilish

4

krary, le 17 avr 2008 à 18:11:17

Désolé pour le retard j'etai partis faire une course.

Donc j'ai essayé de mettre en % mais le soucis c'est que lorsque je bouge ma fenetre, les champs ne sont toujours pas alignés avec l'image.

En pixel, il se déplace de gauche a droite mais pas de haut en bas
En %, il se déplace en diagonal mais pas de haut en bas.

Merci

   
Répondre à krary

5

krary, le 17 avr 2008 à 18:31:33

Up svp

   
Répondre à krary

6

Dalida, le 17 avr 2008 à 19:24:50

Salut,

est-ce que tu as une version en ligne ?

sans le document en entier on va parler dans le vide.

pour tes styles tu devrais déjà tout mettre dans une feuille séparée.
[ Mathieu ] 

Il y a surement des pandas pour ne dépendre de rien

   
Répondre à Dalida

7

 Devilish, le 17 avr 2008 à 20:47:56

Bon dans ce cas place l'image avec des % mais les autre truc place les avec des Pixels...ya pas de secrets essaye tout ce qui te passe par la tête, ça ressemble à un conseil poubelle mais c'est la meilleure façon d'avancer. Et avant tout, pendant tes test pour ton placement, je te conseil d'utiliser plusieurs navigateurs. Le mieux serait que ton site s'affiche de la même manière sur Opera, firefox, IE (malheureusement) et safari. D'ailleurs avec safari tu auras une surprise avec les placements en %... Knoc knock knockin' on heavens door... Open that fucking door buddy!!!!

   
Répondre à Devilish
Posez votre question Répondre
Ils ont besoin de votre aide