Probleme de positionnement
zak
-
cyril1982 Messages postés 110 Date d'inscription Statut Membre Dernière intervention -
cyril1982 Messages postés 110 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
j'ai un petit soucis avec ma page contact.php que des que j'envoi le formulaire et le message d'envoi s'affiche le footer monte en haut de la page!!!
svp si une personne poura m'aider !!
j'att vos reponses
merci
j'ai un petit soucis avec ma page contact.php que des que j'envoi le formulaire et le message d'envoi s'affiche le footer monte en haut de la page!!!
svp si une personne poura m'aider !!
j'att vos reponses
merci
A voir également:
- Probleme de positionnement
- Logiciel positionnement gratuit - Guide
- Exemple test de positionnement greta - Forum Études / Formation High-Tech
- Test de positionnement cesi - Forum Études / Formation High-Tech
- Positionnement google maps - Guide
- Dans le document à télécharger, positionnez l'image dans le cadre gris. mettez un espace de 1 cm autour de l'image. comment se prénomme la personne recherchée ? ✓ - Forum LibreOffice / OpenOffice
3 réponses
Bonjour,
Pour pouvoir t'aider, il faut que tu donnes plus d'informations et une partie de ton code qui pose problème.
Pour pouvoir t'aider, il faut que tu donnes plus d'informations et une partie de ton code qui pose problème.
rebonjour,
Voila mon code html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Graphic-cuisines</title>
<link href='http://fonts.googleapis.com/css?family=Abel' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="style.css" type="text/css" media="screen"/>
<link rel="stylesheet" href="animation.css" type="text/css" media="screen"/>
<link rel="stylesheet" href="contact.css" type="text/css" media="screen"/>
<script type="text/javascript" src="jquery-1.11.0.min.js"></script>
</head>
<body>
<header>
<div id="img" ><img src="contact.jpg" />
</div>
</header>
<section>
<aside><img src="images/co.png" /></aside>
<div id="form_contact">
<form action="process.php" id="contact" method="POST">
<p>
<label for="nom" class="nom"></label>
<br /><input id="nom" name="nom" style="color:white" placeholder=" Nom" type="text">
<span id="msg_nom"></span>
</p>
<p>
<label for="prenom" class="prenom"></label>
<br /><input id="Prenom" name="Prenom" style="color:white" placeholder=" Prenom" type="text">
<span id="msg_nom"></span>
</p>
<p>
<label for="tel" class="tel"></label>
<br /><input id="tel" name="tel" style="color:white" placeholder=" Numéro de téléphone" type="text">
<span id="msg_tel"></span>
</p>
<p>
<label for="sujet" class="sujet"></label>
<br /><input id="sujet" name="sujet" style="color:white" placeholder=" Sujet" type="text">
<span id="msg_sujet"></span>
</p>
<p>
<label for="email"></label>
<br /><input id="email" name="email" style="color:white" placeholder=" @email"type="email">
<span id="msg_email"></span>
</p>
<p>
<label for="message"></label>
<br /><textarea id="message" name="message" style="color:white"placeholder=" ---Message içi---" rows="10" cols="80"></textarea>
<span id="msg_message"></span>
</p>
<p>
<input type="submit" value="Envoyer" />
</p>
</form>
<span id="msg_all"></span>
</div>
</section>
<footer>
<ul class="css3rotate">
<li><a href="index.html"><img src="image1.jpg" /></a></li>
<li><a href="localisation.html"><img src="image2.jpg" /></a></li>
<li><a href="contact.html"><img src="image3.jpg" /></a></li>
</li>
<li><a href="cuisine.html"><img src="image4.jpg" /></a></li>
</li>
<li><a href="equipe.html"><img src="image5.jpg" /></a></li>
<li><a href="tel:+33388119917"><img src="image6.jpg" /></a></li>
<li><a href="index.html"><img src="logo g.jpg" /></a>
</li></div>
</ul>
</footer>
<script src="http://code.jquery.com/jquery-1.8.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$("#contact").submit(function(event){
var nom = $("#nom").val();
var prenom = $("#prenom").val();
var sujet = $("#sujet").val();
var tel = $("#tel").val();
var email = $("#email").val();
var message = $("#message").val();
var dataString = nom + prenom + tel + sujet + email + message;
var msg_all = 'Merci de remplir tous les champs';
var msg_alert = 'Merci de remplir tous les champs';
if(dataString == '')
{
$('#msg_all').html(msg_all);
}
else if(nom == '')
{
$('#msg_nom').html(msg_alert);
}
else if(prenom == '')
{
$('#msg_prenom').html(msg_alert);
}
else if(tel == '')
{
$('#msg_tel').html(msg_alert);
}
else if(sujet == '')
{
$('#msg_sujet').html(msg_alert);
}
else if(email == '')
{
$('#msg_email').html(msg_alert);
}
else if(message == '')
{
$('#msg_message').html(msg_alert);
}
else
{
$.ajax({
type : "POST",
url: $(this).attr('action'),
data: $(this).serialize(),
success : function(){
$('#contact').html('<p> Formulaire bien envoy </p>');
},
error: function(){
$('#contact').html("<p>Erreur d'appel, le formulaire ne peut pas fonctionner</p>");
}
});
}
return false;
});
});
</script>
</body>
</html>
et ma page css est :
@charset "utf-8";
/* CSS Document */
aside{
float:right;
margin-right:200px;
margin-top:50px;
}
#img {
margin-bottom:40px;
padding-left:390px;}
footer
{margin-top:1%;
position:fixed;
botom: 0;}
section
{
margin-bottom: 15px;
margin-left: 80px;
margin-top: 5px;
text-align: left;
}
label{
font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
font-size:14px;
color:#F5F4F4;}
#nom{
background-image:url(images/c.png);background-position:left;background-repeat:no-repeat;padding-left:28px;width:250px;
border:#444444 2px solid;
background-color:#373737;
font-family:}
#Prenom{
background-position:left;
background-repeat:no-repeat;
padding-left:28px;width:250px;
border:#444444 2px solid;
background-color:#373737;}
#tel{
background-image:url(images/tel.png);background-position:left;background-repeat:no-repeat;padding-left:30px;width:247px;
background-color:#373737;
border:#444444 2px solid;}
#sujet{width:280px;
border:#444444 2px solid;
background-color:#373737;}
#email{
background-position:left;background-repeat:no-repeat;padding-left:28px;width:250px;
background-color:#373737;
border:#444444 2px solid;}
#message{
background-position:left;background-repeat:no-repeat;padding-left:20px;width:320px;
}
input{-moz-border-radius:10px;
-webkit-border-radius:10px;-o-border-radius:10px;
border-radius:10px;
border:#444444 2px solid;}
textarea
{
font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
font-size:14px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-o-border-radius:10px;
border-radius:10px;
border:#444444 2px solid;
background-color:#373737;}
#form_contact p{color:#CD373A;}
#form_contact input[type="submit"]
{
color:#FFFFFF;
background-color:#313131;
border:#444444 2px solid;
width: 7%;
}
#form_contact input[type="submit"]:hover
{
background-color:#444444;
cursor: pointer;
}
footer
{
width:100%;
padding-bottom:2%;
padding-top:1%;}
merci pr votre repnse
Voila mon code html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Graphic-cuisines</title>
<link href='http://fonts.googleapis.com/css?family=Abel' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="style.css" type="text/css" media="screen"/>
<link rel="stylesheet" href="animation.css" type="text/css" media="screen"/>
<link rel="stylesheet" href="contact.css" type="text/css" media="screen"/>
<script type="text/javascript" src="jquery-1.11.0.min.js"></script>
</head>
<body>
<header>
<div id="img" ><img src="contact.jpg" />
</div>
</header>
<section>
<aside><img src="images/co.png" /></aside>
<div id="form_contact">
<form action="process.php" id="contact" method="POST">
<p>
<label for="nom" class="nom"></label>
<br /><input id="nom" name="nom" style="color:white" placeholder=" Nom" type="text">
<span id="msg_nom"></span>
</p>
<p>
<label for="prenom" class="prenom"></label>
<br /><input id="Prenom" name="Prenom" style="color:white" placeholder=" Prenom" type="text">
<span id="msg_nom"></span>
</p>
<p>
<label for="tel" class="tel"></label>
<br /><input id="tel" name="tel" style="color:white" placeholder=" Numéro de téléphone" type="text">
<span id="msg_tel"></span>
</p>
<p>
<label for="sujet" class="sujet"></label>
<br /><input id="sujet" name="sujet" style="color:white" placeholder=" Sujet" type="text">
<span id="msg_sujet"></span>
</p>
<p>
<label for="email"></label>
<br /><input id="email" name="email" style="color:white" placeholder=" @email"type="email">
<span id="msg_email"></span>
</p>
<p>
<label for="message"></label>
<br /><textarea id="message" name="message" style="color:white"placeholder=" ---Message içi---" rows="10" cols="80"></textarea>
<span id="msg_message"></span>
</p>
<p>
<input type="submit" value="Envoyer" />
</p>
</form>
<span id="msg_all"></span>
</div>
</section>
<footer>
<ul class="css3rotate">
<li><a href="index.html"><img src="image1.jpg" /></a></li>
<li><a href="localisation.html"><img src="image2.jpg" /></a></li>
<li><a href="contact.html"><img src="image3.jpg" /></a></li>
</li>
<li><a href="cuisine.html"><img src="image4.jpg" /></a></li>
</li>
<li><a href="equipe.html"><img src="image5.jpg" /></a></li>
<li><a href="tel:+33388119917"><img src="image6.jpg" /></a></li>
<li><a href="index.html"><img src="logo g.jpg" /></a>
</li></div>
</ul>
</footer>
<script src="http://code.jquery.com/jquery-1.8.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$("#contact").submit(function(event){
var nom = $("#nom").val();
var prenom = $("#prenom").val();
var sujet = $("#sujet").val();
var tel = $("#tel").val();
var email = $("#email").val();
var message = $("#message").val();
var dataString = nom + prenom + tel + sujet + email + message;
var msg_all = 'Merci de remplir tous les champs';
var msg_alert = 'Merci de remplir tous les champs';
if(dataString == '')
{
$('#msg_all').html(msg_all);
}
else if(nom == '')
{
$('#msg_nom').html(msg_alert);
}
else if(prenom == '')
{
$('#msg_prenom').html(msg_alert);
}
else if(tel == '')
{
$('#msg_tel').html(msg_alert);
}
else if(sujet == '')
{
$('#msg_sujet').html(msg_alert);
}
else if(email == '')
{
$('#msg_email').html(msg_alert);
}
else if(message == '')
{
$('#msg_message').html(msg_alert);
}
else
{
$.ajax({
type : "POST",
url: $(this).attr('action'),
data: $(this).serialize(),
success : function(){
$('#contact').html('<p> Formulaire bien envoy </p>');
},
error: function(){
$('#contact').html("<p>Erreur d'appel, le formulaire ne peut pas fonctionner</p>");
}
});
}
return false;
});
});
</script>
</body>
</html>
et ma page css est :
@charset "utf-8";
/* CSS Document */
aside{
float:right;
margin-right:200px;
margin-top:50px;
}
#img {
margin-bottom:40px;
padding-left:390px;}
footer
{margin-top:1%;
position:fixed;
botom: 0;}
section
{
margin-bottom: 15px;
margin-left: 80px;
margin-top: 5px;
text-align: left;
}
label{
font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
font-size:14px;
color:#F5F4F4;}
#nom{
background-image:url(images/c.png);background-position:left;background-repeat:no-repeat;padding-left:28px;width:250px;
border:#444444 2px solid;
background-color:#373737;
font-family:}
#Prenom{
background-position:left;
background-repeat:no-repeat;
padding-left:28px;width:250px;
border:#444444 2px solid;
background-color:#373737;}
#tel{
background-image:url(images/tel.png);background-position:left;background-repeat:no-repeat;padding-left:30px;width:247px;
background-color:#373737;
border:#444444 2px solid;}
#sujet{width:280px;
border:#444444 2px solid;
background-color:#373737;}
#email{
background-position:left;background-repeat:no-repeat;padding-left:28px;width:250px;
background-color:#373737;
border:#444444 2px solid;}
#message{
background-position:left;background-repeat:no-repeat;padding-left:20px;width:320px;
}
input{-moz-border-radius:10px;
-webkit-border-radius:10px;-o-border-radius:10px;
border-radius:10px;
border:#444444 2px solid;}
textarea
{
font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
font-size:14px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-o-border-radius:10px;
border-radius:10px;
border:#444444 2px solid;
background-color:#373737;}
#form_contact p{color:#CD373A;}
#form_contact input[type="submit"]
{
color:#FFFFFF;
background-color:#313131;
border:#444444 2px solid;
width: 7%;
}
#form_contact input[type="submit"]:hover
{
background-color:#444444;
cursor: pointer;
}
footer
{
width:100%;
padding-bottom:2%;
padding-top:1%;}
merci pr votre repnse