Pb pour fixer les éléments dans mon site web

Bonjour à tous,
je suis nouvelle sur alsacréation et en html aussi d'ailleurs. Je viens de créer mon premier site web pour trouver une alternance:
www.annesophiedoudet.fr
Mon problème, c'est que certains de mes éléments (images, boutons, textes) ne sont pas fixés.
C'est à dire que lorsque je diminue ma fenêtre (ou lorsque le format de fenêtre est inférieure à la taille grand écran d'un 15 pouce, taille sur laquelle je me suis basée pour créer le site), certaines div d'image ou de textes changent de place par rapport à mon fond. Comme si le site était en responsive, or il ne l'est pas (ou du moins ce n'était pas là ma volonté
Bon ce n'est pas simple à expliquer , mais si vous allez sur mon site et que vous diminuez la fenêtre vous comprendrez tout de suite.
Quelqu'un a t'il la réponse?
Merci pour votre aide.

Salut,

Tu as des problèmes de positionnement de div.
Pour faire court il faudrait reprendre le code bout par bout et refaire la structure parce qu'il y a des erreurs qui entraine d'autres erreurs et à la fin ça fait un peu bricolage. Mais t'en fait pas c'est normal et c'est déjà un bon début pour un 1er site !

Déjà tu auras une partie de réponse ici :
http://www.alsacreations.com/apprendre/#positionnement
Modifié par Raphi (13 Aug 2013 - 14:02)

Ca ne répondra pas à ta question mais par exemple tu peux grandement simplifier ton code sur tes boutons "compétences", "parcours", etc...

Actuellement tes boutons ressemblent à ça :

<a href="#page3" class="lien3"><p><div id="bouton-parcours">1 - parcours</div></p></a>
<a href="#page4" class="lien4"><p><div id="bouton-competences">2 - compétences</div></p></a>
<a href="#page5" class="lien5"><p><div id="bouton-realisations">3 - réalisations</div></p></a>
<a href="#page6" class="lien6"><p><div id="bouton-contact">4 - contact</div></p></a>

(Déjà il y a des erreurs, on ne met pas de div dans une balise p)
Et voici le css :

#bouton-parcours{
background-image: url(../img/boutons/bouton-vert.png);
	position: absolute;
	width: 150px;
	background-repeat: no-repeat;
	height: 150px;

	padding-left: 32px;
	padding-top: 59px;

	font-family: 'Lato', sans-serif;
	text-shadow: 2px 2px 3px #5f2d2d;
	font-size: 17px;
	font-weight: 300;
	color: white;
	left: 440px;
	top: 1129px;
}


#bouton-competences{
background-image: url(../img/boutons/bouton-vert.png);
	position: absolute;
	width: 150px;
	background-repeat: no-repeat;
	height: 150px;
	
	padding-left: 14px;
	padding-top: 59px;

	font-family: 'Lato', sans-serif;
	text-shadow: 2px 2px 3px #5f2d2d;
	font-size: 17px;
	font-weight: 300;
	color: white;
	left: 640px;
	top: 873px;
	z-index: 2;
}

#bouton-realisations{
background-image: url(../img/boutons/bouton-vert.png);
	position: absolute;
	width: 150px;
	background-repeat: no-repeat;
	height: 150px;
	
	padding-left: 21px;
	padding-top: 59px;

	font-family: 'Lato', sans-serif;
	text-shadow: 2px 2px 3px #5f2d2d;
	font-size: 17px;
	font-weight: 300;
	color: white;
	left: 849px;
	top: 1129px;
	z-index: 2;
}

#bouton-contact{
background-image: url(../img/boutons/bouton-vert.png);
	position: absolute;
	width: 150px;
	background-repeat: no-repeat;
	height: 150px;
	
	padding-left: 36px;
	padding-top: 59px;

	font-family: 'Lato', sans-serif;
	text-shadow: 2px 2px 3px #5f2d2d;
	font-size: 17px;
	font-weight: 300;
	color: white;
	left: 640px;
	top: 1343px;
	z-index: 2;
}

Tu peux faire la même chose en écrivant ceci :

<a href="#page3" class="bouton" id="bouton-parcours">1 - parcours</a>
<a href="#page4" class="bouton" id="bouton-competences">2 - compétences</a>
<a href="#page5" class="bouton" id="bouton-realisations">3 - réalisations</a>
<a href="#page6" class="bouton" id="bouton-contact">4 - contact</a>

Et le css:

.bouton{
background-image: url(../img/boutons/bouton-vert.png);
width:150px;
height:150px;
font-family: 'Lato', sans-serif;
text-shadow: 2px 2px 3px #5f2d2d;
font-size: 17px;
font-weight: 300;
color:white;
}

Ensuite tu positionnes tes boutons en les appelant grâce à leurs id comme tu as fait :

#bouton-parcours{
...
}
#bouton-competences{
...
}

#bouton-realisations{
...
}

#bouton-contact{
...
}

Merci raphi pour ta réponse.
Je sens que je vais encore avoir beaucoup de travail !
Je vais essayer d'arranger ça.

Merci encore