FORUM D’ENTRAIDE INFORMATIQUE (FEI)
Site d’assistance et de sécurité informatique

Entraide pour le programmation en général (tous langages).
Règles du forum : Entraide concernant la programmation informatique en général, tous langages : recherche ou correction d'un code ou d'une fonction, aide à la réalisation d'un projet...
Pour la programmation web (HTML, CSS, PHP, MySQL...), il est conseillé de s'orienter dans le forum Webmastering.
Merci de lire et de respecter la charte générale du forum.
  • Avatar du membre
  • Avatar du membre
Avatar du membre
par cherubin
#137321
Bonjour je suis nouveau sur ce forum qui m'a l'air fort sympathique j’espère pouvoir trouver une aide pour résoudre un problème grave!!


J'essaye desesperement d’insérer un formulaire de contact sur le site internet que je suis en train de me faire ( et oui je suis un gros n@@b en la matière!  )

Impossible d’insérer un lien potable a chaque fois fois je me retrouve devant une montagne de problème (onglet qui n’apparaît pas, pas de bouton envois etc..) enfin bref je suis vraiment perdu.

J'ai ecumé beaucoup de site et aucune solution a mon probléme ...  

Je cherche juste a intégrer un formulaire de contact html sur cette page contact je ne pensais pas que c’était aussi dure que cela!!!!


Je met en lien mon site complet il s'agit de la page contact.htl comme vous l'aurez deviner! http://cjoint.com/14ju/DGnrajJdqQr.htm

je travail sur dreamweaver (html+css)


En espérant que cela puisse vous aider!

merci bien
Avatar du membre
par cherubin
#137324
coucou j'ai mit en lien tout mon site    tu devrais pouvoir le retrouver?

je met le code source au cas ou mais j'ai surtout l'impression que c'est le css qui bug:










FlatFolio : Mon Portfolio
   


   
   



   




   







   

         
                 
                 
                 
         
         
         
         
          [img]images/header-facebook.png[/img]
            [img]images/header-twitter.png[/img]
[img]images/header-googleplus.png[/img]
         
       

       
       
Archi.
       
     
     
  •          
  • Accueil
  • A Propos
  • Portfolio
  • CV
  • Contact
             
     
     
     
     
     
     
      Vous êtes ici : Accueil Portfolio
     
     
       
       
         
     
     
      Formulaire de contact :




Pour envoyer des données, votre navigateur doit accepté les Iframes ou cadres, c'est sans dangé pour votre machine.
     
     
   

   
   





   
  •        
  • Archi.
             
  • Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean fringilla, libero eu volutpat lacinia, turpis neque lobortis neque, vitae elementum sem tellus ut ipsum. Nunc fermentum ultrices purus, vel laoreet arcu condimentum ut. Nullam dapibus luctus libero. Praesent laoreet tempor felis ac varius...
           
       
       
       
  •        
  • Commentaires
             
  • Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean fringilla, libero eu volutpat lacinia Lire la suite...
             
  • Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean fringilla, libero eu volutpat lacinia Lire la suite...
           
       
       
  •        
  • Nous suivre
             
  • Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean fringilla, libero eu volutpat lacinia, turpis neque lobortis...
             
  •           [img]images/icon-facebook-footer.png[/img]
              [img]images/icon-twitter-footer.png[/img]
              [img]images/icon-google-footer.png[/img]
              [img]images/icon-youtube-footer.png[/img]
             
           
   
   
   




   
  •        
  • © 2014 -
           
       
       
  • Accueil |
               
  • A propos |
               
  • Portfolio |
               
  • Contact |
               
  • Mentions légales |
               
  • Sitemap
           
   







merci!  

Ps: j'aime beaucoup ton avatar  
par KeRR_@
#137332
Mais NNAAAAAN JE VEUX code source je peux pas te dire ce qui cloche avec une page de ton site qui est décorer de cheuvrons vert FLUO ho
PROPULSITE
Avatar du membre
par cherubin
#137369
coucou désole j’étais dehors! je viens de lire ton article, d’après ce que je comprend certain navigateurs interprètent le margin pour du pading? ce qui peut provoquer des bugs c'est pour cela qu'il faut faire appel a un reset css??


C'est trés instructif tout ca! mais je ne sais pas trop quoi changer dans a feuille de style pour le coup!


merci pour ta lecture en tout cas.
par KeRR_@
#137389
Salut,

Les lignes de code javascripts mets les en bas de page avant la fermeture du /HTML tes pages se chargeront plus vite.

En tout je retrouve pas les " h1, h2, h3 "Réduit la largeur de tes champs " e-mail, code, ect.."

J'envoie le code html et css un peux changé " le diez " # " à la place du "point . "
pour afficher.

Sinon tu devras reprendre tout " Code " par ligne en paralléle avec le  CSS pour pouvoir retrouvé les erreurs.

reprend ces code dans une page html/css pour comparer je sais que tu as Javascript et Jquery mais a toi de voir.


Le code CSS :

html, body { height: 100%;}
body { font-family:'Raleway', sans-serif; font-weight:300; color:#222; font-size:14px; background:url(images/bande-couleur.png) repeat-x; padding-top:5px; }

.a { color:#e35844; text-decoration:none; transition:0.5s;}/*FORMULAIRE DE CONTACTE*/
a  :hover { color:#222; text-decoration:underline;}
p { text-align:justify;}/* Tu oublies point-virgule */


.clearboth { clear:both}

/* [TITRES]------------------------------------------------------------------------------ */
h1 { font-size:50px; color:#222; font-weight:700; margin:0px 0px 5px 0px; }
h2 { font-size:30px; color:#999; font-weight:400; margin:0px 0px 5px 0px; }
h3 { font-size:25px; color:#222; font-weight:400; margin:40px 0px 20px 0px; }
style type="text/css" media="screen all"!--
input { color: #000; font-size: 11px; font-family: verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular; background-color: #EEEEEE; }
#select{ color: #000; font-size: 11px; font-family: verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular; background-color: #EEEEEE; }
#textarea { color: red; font-size: 11px; font-family: verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular; background-color: #EEEEEE; }
txterror { color: black; font-size: 11px; font-family: Verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular; }
txtform { color: black; font-size: 12px; font-family: Verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular; }


/* [ACCUEIL]------------------------------------------------------------------------------ */

/* COULEUR / SPAN -----*/
#jaune { background-color:#ffee00;}/* Tu oublies point-virgule */

/* MARGIN / PADDING -----*/

#conteneur { width:1020px; margin:auto; min-height:100%; position:relative;}
/* HEADER -----*/
.header-accueil { width:1000px; padding:10px; margin-bottom:90px;}
.header-top { width:1000px; height:80px;}
.recherche { width:885px; height:45px; float:left; margin-right:10px; margin-top:35px;}

.wrap {display: inline-block;position: relative;height: 30px;float: right;padding: 0;position: relative;}

.input[type="text"] {height: 30px;font-size: 30px;display: inline-block;font-weight: 400;border: none;outline: none;color: #555;padding: 0px;padding-right: 60px;width: 0px;position: absolute;top: 0;right: 0;background: none;z-index: 3;transition: width .4s cubic-bezier(0.000, 0.795, 0.000, 1.000);cursor: pointer;}

.input[type="text"]:focus:hover {border-bottom: 1px solid #BBB;}
.input[type="text"]:focus {width: 425px;z-index: 1;border-bottom: 5px solid #BBB;cursor: text;}
.input[type="submit"] {height: 30px;width: 30px;display: inline-block;color:red;float: right;background: url(images/header-loupe.png) center center no-repeat;text-indent: -10000px;border: none;position: absolute;top: 0;right: 0;z-index: 2;cursor: pointer;opacity: 1;cursor: pointer;transition: opacity .4s ease;}

#input[type="submit"]:hover {opacity: 0.5;}

.social {height:42px; float:left; border-left:1px solid #d6d6d6; margin-top:20px; padding-left:5px; padding-top:15px}
.social a { transition:opacity .4s;}
.social a:hover { opacity:0.5}
#logo { width:185px; height:45px; float:left; font-size:33px;}
#logo a { color:#222; text-decoration:none;}

.menu { width:815px; height:45px; float:left; margin-bottom:30px; text-align:right; }
.menu ul { margin:0 ; padding:0}
#menu li { display:inline; margin-right:30px; font-size:20px;}
#menu li:last-child { margin-right:0;}

#menu li a { padding:4px 10px; color:#000; line-height:2em; text-decoration:none; text-align:right; transition:0.5s;}
#menu li a:hover { color:#222; background:#eee;}
#menu li a.active { color:#fff; background:#38b39d;}

#contenu-accueil { width:100%}
#voir-portfolio a { text-decoration:none; font-size:30px; border-bottom:1px dotted black; color:#222; transition:0.5s; background:url(images/pictures.png) no-repeat 0 3px; font-weight:700px; padding-left:30px;}
#voir-portfolio a:hover { border-bottom:1px dotted #e35844; color:#e35844; background:url(images/pictures-orange.png) no-repeat 5px 3px; font-weight:700px;}

/* SLIDER -----*/
#slide-accueil { width:1020px; margin-bottom:30px;}

.cbp-fwslider {
    position: relative;
    margin: 0 0 10px;
    overflow: hidden;
  
}
 
.cbp-fwslider ul {
    margin: 0;
    padding: 0;
    white-space: nowrap;
    list-style-type: none;
}
 
.cbp-fwslider ul li {
    transform: translateZ(0);
    float: left;
    display: block;
    margin: 0;
    padding: 0;
}
 
.cbp-fwslider ul li a,
.cbp-fwslider ul li div {
    display: block;
    text-align: center;
    outline: none;
}
 
.cbp-fwslider ul li a img {
    border: none;
    display: block;
    margin: 0 auto;
    max-width: 100%;
}
 
.cbp-fwslider nav span {
    position: absolute;
    top: 50%;
    width: 50px;
    height: 100px;
    background: #ffee00;
    color: #222;
    font-size: 50px;
    text-align: center;
    margin-top: -50px;
    line-height: 100px;
    cursor: pointer;
    font-weight: normal;
}
 
.cbp-fwslider nav span:hover {
    background: #38b39d;
 color:#fff;
}
 
.cbp-fwslider nav span.cbp-fwnext {
    right: 0px;
}
 
.cbp-fwslider nav span.cbp-fwprev {
    left: 0px;
}
 
.cbp-fwdots {
    position: absolute;
    bottom: 0px;
    white-space: nowrap;
    text-align: center;
    width: 100%;
}
 
.cbp-fwdots span {
    display: inline-block;
    width: 18px;
    height: 18px;
    background: #ddd;
    margin: 4px;
    border-radius: 50%;
    cursor: pointer;
}
 
.cbp-fwdots span:hover {
    background: #fff;
}
 
.cbp-fwdots span.cbp-fwcurrent {
    background: #38b39d;
    
    transition: box-shadow 0.2s ease-in-out;
}


#articles { width:1020px; height:auto; margin-bottom:60px;}
#articles h1 { color:#38b39d; font-size:30px; font-weight:500px; padding:0; margin:0; background:url(images/icon-alignleft.png) no-repeat 0 2px; padding-left:40px; border-bottom:1px solid #bebebe; padding-bottom:20px; margin-bottom:20px;}
#articles h2 { color:#666; font-size:24px; font-weight:400px; padding:0; margin:0; background:url(images/icon-alignleft-noir.png) no-repeat 0 0px; padding-left:40px;}

.article-boucle { width:510px; height:auto; float:left;}
.article-boucle ul { padding:0; margin:0; width:270px; float:left; margin-right:13px}
.article-boucle ul:last-child { width:215px; margin:0}
.article-boucle li { padding:0; margin:0; list-style:none;}
.article-boucle img { transition: opacity .4s; -moz-transition: all 0.3s ease-in-out 0s;-webkit-transition: all 0.3s ease-in-out 0s;-o-transition: all 0.3s ease-in-out 0s;-ms-transition: all 0.3s ease-in-out 0s;}

.article-boucle img:hover { opacity:0.5; -moz-transform: rotate(5deg) scale(1.20);-webkit-transform: rotate(5deg) scale(1.20);-o-transform: rotate(5deg) scale(1.20);-ms-transform: rotate(5deg) scale(1.20);transform: rotate(5deg) scale(1.20); }


#articles p { font-size:14px; padding-left:40px; color:#222; margin-top:30px;}



#articles .meta-acc { font-size:12px; padding-left:40px; color:#999; margin-top:20px;}

#client-acc { width:100%; height:auto; margin-bottom:30px;}
#client-acc h1 { color:#38b39d; font-size:30px; font-weight:500; padding:0; margin:0; background:url(images/icon-clients.png) no-repeat;padding-left:40px; border-bottom:1px solid #bebebe; padding-bottom:20px; margin-bottom:20px;}




/*CONTACT------------------------------------------------------------------------------------*/

form {
  /* Just to center the form on the page */
  margin: 0 auto;
  width: 400px;

  /* To see the limits of the form */
  padding: 1em;
  border: 1px solid #CCC;
  border-radius: 1em;
}

div + div {
  margin-top: 1em;
}

label {
  /* To make sure that all label have the same size and are properly align */
  display: inline-block;
  width: 90px;
  text-align: right;
}

input, textarea {
  /* To make sure that all text field have the same font settings
     By default, textarea are set with a monospace font */
  font: 1em sans-serif;

  /* To give the same size to all text field */
  width: 300px;

  -moz-box-sizing: border-box;
       box-sizing: border-box;

  /* To harmonize the look feel of text field border */
  border: 1px solid #999;
}

input:focus, textarea:focus {
  /* To give a little highligh on active elements */
  border-color: #000;
}

#textarea {
  /* To properly align multiline text field with their label */
  vertical-align: top;

  /* To give enough room to type some text */
  height: 5em;
color:pink;
  /* To allow users to resize any textarea vertically
     It works only on Chrome, Firefox and Safari */
  resize: vertical;
}

#button {
  /* To position the buttons to the same position of the text fields */
  padding-left: 90px; /* same size as the label elements */
}

button {
  /* This extra magin represent the same space as the space between
     the labels and their text fields */
  margin-left: .5em;
}


/* [TEAMPLATE GENERAL]------------------------------------------------------------------------------ */

#header { width:1000px; padding:10px; margin-bottom:10px;}
#arianne { width:100%; margin-bottom:30px;}
#arianne a { color:#38b39d;}
#contenu { width:700px; float:left; padding-bottom:50px;}
#contenu ul { padding:0; margin:0}
#contenu li { list-style:none; padding:0; margin:0}
#slide-tp { width:100%; margin-top:30px; margin-bottom:30px;}

#sidebar { width:270px; float:left; margin-left:50px;}
#sidebar ul { padding:0; margin:0; margin-bottom:30px; padding-bottom:15px;}
#sidebar li { padding:0; margin-bottom:15px; list-style:none;}
#sidebar h1 { font-size:25px; color:#222; font-weight:400; margin:0 0 20px 0;}

#sidebar a img { transition: opacity .4s;}
#sidebar a img:hover { opacity:0.5}

#infocompimg { width:280px; float:left}
#infocomp { width:420px; float:left}
#infocomp li { line-height:22px; margin-bottom:5px;}

.catsidebar a { font-size:18px; color:#38b39d; background:url(images/icon-valid.png) no-repeat; padding-left:30px; font-weight:500; text-decoration:none;}

.catsidebar a:hover { color:#222; padding-left:40px;}

.meta { font-size:12px; color:#999;}


.blog-fiche { width:100%; margin-bottom:10px; margin-top:30px; height:210px;}
.blog-fiche ul { margin-top:10px!important;}
.blog-fiche li { margin-bottom:5px!important; line-height:20px;}
.blog-fiche h1 { font-size:20px; color:#222; font-weight:400; margin:0; margin-bottom:5px;}
.blog-fiche-img { width:300px; float:left;}

.blog-fiche-img img { transition: opacity .4s; -moz-transition: all 0.3s ease-in-out 0s;-webkit-transition: all 0.3s ease-in-out 0s;-o-transition: all 0.3s ease-in-out 0s;-ms-transition: all 0.3s ease-in-out 0s;}

.blog-fiche-img img:hover { opacity:0.5; -moz-transform: rotate(-5deg) scale(1.05);-webkit-transform: rotate(-5deg) scale(1.05);-o-transform: rotate(-5deg) scale(1.05);-ms-transform: rotate(-5deg) scale(1.05);transform: rotate(-5deg) scale(1.05); }

.blog-fiche-info { width:360px; float:left; padding-top:5px;}




/* skillbar ------------------------------------ */
.skillbar {
 position:relative;
 display:block;
 margin-bottom:15px;
 width:100%;
 background:#eee;
 height:35px;
 border-radius:3px;
 -moz-border-radius:3px;
 -webkit-border-radius:3px;
 -webkit-transition:0.4s linear;
 -moz-transition:0.4s linear;
 -ms-transition:0.4s linear;
 -o-transition:0.4s linear;
 transition:0.4s linear;
 -webkit-transition-property:width, background-color;
 -moz-transition-property:width, background-color;
 -ms-transition-property:width, background-color;
 -o-transition-property:width, background-color;
 transition-property:width, background-color;
}

.skillbar-title {
 position:absolute;
 top:0;
 left:0;
width:130px;
 font-weight:bold;
 font-size:13px;
 color:#ffffff;
 background:#6adcfa;
 -webkit-border-top-left-radius:3px;
 -webkit-border-bottom-left-radius:4px;
 -moz-border-radius-topleft:3px;
 -moz-border-radius-bottomleft:3px;
 border-top-left-radius:3px;
 border-bottom-left-radius:3px;
}

.skillbar-title span {
 display:block;
 background:rgba(0, 0, 0, 0.1);
 padding:0 20px;
 height:35px;
 line-height:35px;
 -webkit-border-top-left-radius:3px;
 -webkit-border-bottom-left-radius:3px;
 -moz-border-radius-topleft:3px;
 -moz-border-radius-bottomleft:3px;
 border-top-left-radius:3px;
 border-bottom-left-radius:3px;
}

.skillbar-bar {
 height:35px;
 width:0px;
 background:#6adcfa;
 border-radius:3px;
 -moz-border-radius:3px;
 -webkit-border-radius:3px;
}

.skill-bar-percent {
 position:absolute;
 right:10px;
 top:0;
 font-size:11px;
 height:35px;
 line-height:35px;
 color:#ffffff;
 color:rgba(0, 0, 0, 0.4);
}


/* folio --------- */

nav.primary {
    width:auto;
    margin:30px auto;
    display:table;
}
 
nav.primary ul li  {
    float:left;
    list-style:none;
}
 
nav.primary ul li a {
    height:39px;
    display:block;
    font-size:15px;
    color:#000;
    padding:0 10px;
    text-decoration:none;
    line-height:39px;
}
 
nav.primary li a.selected {
    border-bottom: 3px solid #ED3131;
}
 
.main {
    padding:0;
    margin:0;
    display:block;
}
 
.entry {
    position:relative;
    float:left;
    margin:5px;
    cursor:pointer;
    width:495px;
    height:330px;
    padding:0;
}
 
.portfolio { margin:0; }
 
.magnifier {
    background:rgba(56,179,157,.7) url(images/icon-plus.png) no-repeat center;
    position:absolute;
    top:0px;
    left:0px;
    bottom:0px;
    right:0px;
    opacity:0;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -ms-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out;
}
.video-hover {
    background:rgba(56,179,157,.7) url(images/icon-plus.png) no-repeat center;
    position:absolute;
    top:10px;
    left:10px;
    bottom:10px;
    right:10px;
    opacity:0;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -ms-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out;
}
 
entry:hover .video-hover,
entry:hover .magnifier { opacity:1; }
 
#img {
    max-width:100%;
}
 
isotope-item {
  z-index: 2;
}
 
isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}
 
isotope,
.isotope .isotope-item {
-webkit-transition-duration: 0.8s;
   -moz-transition-duration: 0.8s;
        transition-duration: 0.8s;
}
 
isotope {
-webkit-transition-property: height, width;
   -moz-transition-property: height, width;
        transition-property: height, width;
}
 
isotope .isotope-item {
-webkit-transition-property: -webkit-transform, opacity;
   -moz-transition-property:    -moz-transform, opacity;
        transition-property:         transform, opacity;
}



/*Formulaire------------------------------------------------------------------------------*/

.cssform {
width: 700px;
clear: left;
margin: 0;
padding: 5px 0 8px 0;
padding-left: 555px; /*width of left column containing the label elements*/
border-top: 5px dashed gray;
height: 1%;
}

.cssform  label{
font-weight: bold;
float: left;
margin-left: -155px; /*width of left column*/
width: 150px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
}

cssform  input[type="text"]{ /*width of text boxes. IE6 does not understand this attribute*/
width: 180px;
}

#cssform textarea{
width: 50px;
height: 90px;
}

/*.threepxfix class below:
Targets IE6- ONLY. Adds 3 pixel indent for multi-line form contents.
to account for 3 pixel bug: http://www.positioniseverything.net/exp ... xtest.html
*/

 html .threepxfix{
margin-left: 3px;
}
/* [footer]------------------------------------------------------------------------------ */
#footer { width:auto; height:350px; background:url(images/bande-couleur.png) repeat-x; background-color:#455d6b; color:#dfdfdd;}
#footer-top { width:1020px; margin:auto;height:auto; padding-top:45px; padding-bottom:45px;}
#footer-top ul { width:249px; padding:20px; margin:0; float:left; border-right:1px solid #67757d;}
#footer-top ul:last-child { border-right:5px;}
#footer-top li {  margin:0; padding:0; list-style:none;}
#footer-top li p { padding-bottom:20px; border-bottom:1px solid #67757d}
#footer-top li:last-child p  { padding-bottom:0px; border-bottom:0px;}
#footer-top li p a { color:#38b39d; }
#footer-top a img { transition: opacity .4s;}
#footer-top a img:hover { opacity:0.5}


.titre-footer { width:100%; font-size:33px; margin-bottom:30px; color:#fff;}

#footer2 { width:100%; height:140px;background-color:#324d5d; color:#dfdfdd;}
#footer-bottom { width:1000px; margin:auto; padding:50px 10px;}
#footer-bottom ul { float:left;}
#footer-bottom ul.copyright { width:380px; padding:0; margin:0;}
#footer-bottom ul.liens { width:510px; padding:0; margin:0; float:right; text-align:right;}
#footer-bottom li { list-style:none; padding:0; margin:0; display:inline;}

#footer-bottom a { color:#dfdfdd;}
#footer-bottom a:hover { color:green;}  

/* [Media QUERIES]------------------------------------------------------------------------------ */


/*CONTACt------------------------------------------------------------------------------------------*/

input { color: #000; font-size: 11px; font-family: verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular; background-color: #EEEEEE }
.select { color: #000; font-size: 11px; font-family: verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular; background-color: #EEEEEE }
.textarea { color: #000; font-size: 11px;width:50; heigh:30:font-family: verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular; background-color: #EEEEEE }
.txterror { color: black; font-size: 11px; font-family: Verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.txtform { color: black; font-size: 12px; font-family: Verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
/*CONTACt FIN------------------------------------------------------------------------------------------*/



@media screen all and (max-width:1025px) {
/* on force l'affichage pour les résolutions 1024 */
#conteneur, #slide-accueil, #footer, #footer-top, #footer2 { width:1024px;}
#header-accueil, #header, #header-top, #header-accueil, #footer-bottom { width:1000px;}

.entry {
    position:relative;
    float:left;
    margin:10px;
    cursor:pointer;
    width:380px;
    height:300px;
    padding:0;
}
}



Le code HTML


!doctype html
html xmlns="http://www.w3.org/1999/xhtml"
head
 meta charset="UTF-8" /
 titleFlatFolio : Mon Portfolio/title
    !--| CSS | --
 link rel="stylesheet" href="style.css" type="text/css" /!-- Appel de la feuille de stlyle générique --
 link rel="stylesheet" href="style/normalize.css" type="text/css"!-- réinitialisation des valeurs à 0 sur des propriétés CSS  --
    link rel="stylesheet" type="text/css" href="style/jquery.bxslider.css" /!-- Appel du carousel clients / projets --
  
 !-- Appel Google font Raleway --
 link href='http://fonts.googleapis.com/css?family= ... 00,700,800' rel='stylesheet' type='text/css'
 !-- Autorise l'usage des nouveaux éléments HTML5 sur IE 9 --
 !--[if lt IE 9]
 script src="http://html5shim.googlecode.com/svn/tru ... js"/script
 ![endif]--
    meta name="viewport" content="width=device-width" /!-- Optimisation en largeur pour correspondre à la largeur de l'écran du périphérique --

/head

body
div id="conteneur"
 header id="header"
     div id="header-top"
 div id="recherche"
           div id="wrap"
                  form action="" autocomplete="on"
                  input id="search" name="search" type="text" placeholder="Vous recherchez ?"input id="search_submit" value="Rechercher" type="submit"
                  /form
           /div
           /div
          
           div id="social"
           a href="#" title="facebook"img src="images/header-facebook.png" alt="Mon facebook"/a
             a href="#" title="twitter"img src="images/header-twitter.png" alt="Mon twitter"/a
 a href="#" title="googleplus"img src="images/header-googleplus.png" alt="Mon googleplus"/a
           /div
        
 /div
        
        
 div id="logo"a href="#"ArchibGraf/b./a/div
        
       nav id="menu"!--Tu peux toujour enlever class active--
       ul
               lia class="active"  href="index.html" title=""Accueil/a/li
 lia class="active" href="apropos.html" title=""A Propos/a/li
 lia class="active" href="portfolio.html" title=""Portfolio/a/li
 lia class="active" href="blog.html" title=""CV/a/li
 lia class="active"  href="contact.html" title=""ContactYO/a/li
           /ul
       /nav
      
       div class="clearboth"/div
       /header
      
      
       div id="arianne"Vous êtes ici : a href="#" Accueil/a Portfolio/div
       section id="contenu-accueil"
      
        
        
          
       !--/section tu l'as mise là --
      
       a href="http://propulsite.com/formulaires/" title="Créez gratuitement votre formulaire de contact." alt="Créez gratuitement votre formulaire de contact."Formulaire de contact :/abr
!--Formulaire :--
script type="text/javascript" src="http://propulsite.com/formulaires/js_11 ... 5171f53.js" /script
!--iframe ou sera envoyé les données :--
iframe name="IframeRepPropulsite_10902f615171f53" id="IframeRepPropulsite_10902f615171f53" src="http://propulsite.com/formulaires/frame.html" height="70" width="90" scrolling="no" frameborder="0"Pour envoyer des données, votre navigateur doit accepté les Iframes ou cadres, c'est sans dangé pour votre machine./iframe
      
         /section!--déplacer la balise de fermeture sinon ou la positionné :--
    
 div class="clearboth"/div
    
    
 

/div
footer id="footer"
 div id="footer-top"
     ul
         lidiv class="titre-footer"ArchibGraf/b./div/li
           lipLorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean fringilla, libero eu volutpat lacinia, turpis neque lobortis neque, vitae elementum sem tellus ut ipsum. Nunc fermentum ultrices purus, vel laoreet arcu condimentum ut. Nullam dapibus luctus libero. Praesent laoreet tempor felis ac varius.../p/li
        /ul
        
        
        ul
         lidiv class="titre-footer"Commentaires/div/li
           lipLorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean fringilla, libero eu volutpat lacinia a href="#"Lire la suite.../a/p/li
           lipLorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean fringilla, libero eu volutpat lacinia a href="#"Lire la suite.../a/p/li
        /ul
        
        ul
         lidiv class="titre-footer"Nous suivre/div/li
           lipLorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean fringilla, libero eu volutpat lacinia, turpis neque lobortis.../p/li
           li
           a href="#"img src="images/icon-facebook-footer.png"/a
           a href="#"img src="images/icon-twitter-footer.png"/a
           a href="#"img src="images/icon-google-footer.png"/a
           a href="#"img src="images/icon-youtube-footer.png"/a
           /li
        /ul
    div class="clearboth"/div
    /div
    
/footer

footer id="footer2"
 div id="footer-bottom"
     ul class="copyright"
         li© 2014 bArchigraf/b - /li
        /ul
        
        ul class="liens"
 lia href="#"Accueil/a |/li
            lia href="#"A propos/a |/li
            lia href="#"Portfolio/a |/li
            lia href="#"Contact/a |/li
            lia href="#"Mentions légales/a |/li
            lia href="#"Sitemap/a/li
        /ul
    /div
/footer
 !--| JS |toujour avant les balise de fermeture pour le chargement de tes pages  --
 script src="js/modernizr.custom.js"/script!-- Bibliothèque JavaScript conçue pour détecter des fonctionnalités spécifiques de HTML et CSS dans les navigateurs --
 script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jq ... js"/script!-- Librairie JQUERY --
 script src="js/jquery.bxslider.min.js"/script!-- Appel JS du carousel --
    script type="text/javascript" src="js/jquery.isotope.min.js"/script!-- Appel JS du Portfolio --
/body
/html

Bonne nuit.
par KeRR_@
#137841
Bonjour Rubin

Euh non pas vraiment ^^,

Word press en coup de vent . Qui y'a t-il ? ta page s'affiche correctement


mais tu en es où ? as-tu fais des portions de pages avec " include"

Je ne voie pas ta balise form pour ton formulaire ?
Avatar du membre
par cherubin
#138589
coucou!!! Je n'ai aucun signalement pour ta réponse!! heureusement que je passais pas hasard!!!
Vraiment désolééé     

J'ai finit la maquette du site je voudrais le mettre en ligne

- Et Frenchement je comprend rien avec phpmyadmin sous ovh pourquoi c'est toujours aussi compliqué? ça peut pas être plus simple????

Pour résumé j'ai fais mon site en local avec Easy php et wordpress mais je ne trouve aucuntutoriel CLAIR sur l'export de site ....


je sais pas quoi faire... Je dois ré-ouvrir un topique??   
Avatar du membre
par goélette
#138604
Bonjour Chérubin

Pour la balle, pas tout suite, ce serait mieux. ^^

coucou!!! Je n'ai aucun signalement pour ta réponse!! heureusement que je passais pas hasard!!!

C'est normal, tu es un invité (par définition de passage). Si tu veux avoir des alertes, inscris-toi (c'est facile et gratuit)
http://www.forum-entraide-informatique. ... re-sur-fei

Sinon, pour mettre ton site en ligne (sur OVH), ça paraît en effet un peu compliqué, mais en imprimant ce tuto et en le suivant pas à pas, ça devrait être faisable.   

http://www.dysign.fr/comment-mettre-en- ... ess-local/
par KeRR_@
#138607
Bonjour Rubin

Ce n'est pas difficile tu sais ^^, il faut seulement bien lire les instructions.

Je sais que tu passes en invité mais ne laisse pas ton topic entre ciel et terre.

Alors, expliques tes malheures ^^ avant que je te donne la balle.

Où tu coinces avec Phpmyadmin et qu'est ce que tu veux faire ?

@ te lire
Avatar du membre
par cherubin
#138639
Coucou  goelan et Kerr!

Tout d'abord merci pour vos réponses j'ai franchit le pas je me suis inscrit j'ai même like votre fb!!  

J'ai suivis ton tuto Goelan!! tout marche bien jusqu' à l'étape 5:

je  dois faire ca dans le fichier wp-config.php (que j'ai uploader sur Filezila hein??? c'est bien celui la??)

Ce que vous devez changer :

Nom de la base de données
Identifiant (même que la base généralement, comme chez OVH)
Mot de passe de la base de données
Hôte (parfois il reste localhost, chez OVH c’est du genre sql5-50.perso)


J'ai mes identifiant utiliser pour Wordpress (Nom de l'admin et MDP)

Mais j'ai aussi recus ca de OVH



Bonjour,

Votre base MySQL a été installée sur notre serveur.


Voici les données techniques:
-----------------------------

MySQL:
Serveur :**********.mysql.db
Utilisateur : agencearjm***
Nom de la base : agencearjm***
Mot de passe : bDH2NcPK9***



je dois rentrer quoi au fait la ???  

j'ai ca comme message quand je vais sur internet :

Erreur lors de la connexion à la base de données
par KeRR_@
#138645
Bonjour Rubin

Bienvenue parmi nous et surtout tu vas plus avoir des cheuveux sur la tête si tu continu à te les arracher.


Tu as changé le nom de ta base de donné, il reconnait pas la nouvelle bdd !
par KeRR_@
#138647
Fais une capture d'ecran ^^, ne t'en fais tu y est prèsque Rubin  

Ps; Click sur l'enveloppe à coté du bouton déconnexion.
par KeRR_@
#138811
Bonjour rubin

S'il te plait, reconnecte toi pour avoir un autre mot de pass pour ta base de données.

On reprend du début jusqu'a la 5em étape.

Là, tu as déjà ces  3 fichiers que tu vas encore recréer.

Quand tu vas y arriver tu me dis ce que tu voies.

Ps: Ne supprime rien laisse les de coté que tu ne fasse pas de bétises

@ +
Avatar du membre
par cherubin
#139010
problème réglé si vous avez besoin d'un architecte sur Bordeaux:D je fais une ristourne pour l'aide apporté (bon le site est pas encore finit je termine demain agence-archigraf.org


Merci ma Keera      

hey Eh beh tu vas bien te faire balader par tes co[…]

Aide SEO

Si vous êtes trop à court d'idé[…]

Game

J’ai toujours aimé essayer de nouveau[…]

Game

Ce site m’a impressionné par la quali[…]