Menu qui bouge apres insertion image

Fermé
arcad16 - 16 août 2010 à 16:11
notobe Messages postés 1952 Date d'inscription mercredi 11 novembre 2009 Statut Membre Dernière intervention 8 juillet 2011 - 16 août 2010 à 20:24
Bonjour à tous

Voila, j'ai attaqué ce weekend un petit site internet sur dreamweaver en html sans auqu'une notion et je peux vous dire franchement que je galère pas mal.

Je cherche à faire le truc le plus simple possible, mais même ca, je n'y arrive pas, je vous explique :

j'ai un menu a gauche.

J'aimerais que ce menu ne bouge pas, qu'il soit fixe car, quand je veux mettre une vidéo centré ou une image tout se décale !
si je mets une video en haut centré, le menu de gauche déscend...
voici mon code :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="shortcut icon" type="image/x-icon" href="images/am.ico"/>
<title>titre du site</title>
<style type="text/css">
body,td,th {
font-family: Verdana, Geneva, sans-serif;
font-size: 11px;
color: #000;
}
body {
background-color: #FFF;
background-image: url(images/motif1.png);
font-size: 11px;
}
body p {
font-family: Arial, Geneva, sans-serif;
margin: 20px;
}
a {
color: #000000;
text-decoration:none;
font-family:Arial,Verdana;
}
a:hover {
color: #3399ff;
text-decoration:none;
font-family:Arial,Verdana;
}
a:visited {
color: #000000;
text-decoration:none;
font-family:Arial,Verdana;
}
</style>
</head>
<body>
<h1> </h1>
<p><span style="background:#66ccff"><a href="http://www.monsite.com/" target="parent">mon nom</a></span></p>
<p>
<span style="background:#FFFFFF">profession</span>
</p>
<p><span style="background:#FFFFFF">TEL</span>
</p>
<p><span style="background:#FFFFFF"><a href="mailto:mail@mail.com">mail@mail.com</a></span><p/>
<p> </p>



<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages2" target="parent">menu2</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages3" target="parent">menu3</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages4" target="parent">menu4</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages5" target="parent">menu5</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages6" target="parent">menu6</a></span></p>
<p><span style="background:#FFFFFF"><a href="http://www.monsite.com/pages7" target="parent">menu7</a></span></p>
</body>
</html>


Aidez moi s'il vous plait, j'en es mal à la tête tellement !!
Merci :)
A voir également:

3 réponses

notobe Messages postés 1952 Date d'inscription mercredi 11 novembre 2009 Statut Membre Dernière intervention 8 juillet 2011 213
16 août 2010 à 17:53
Petite remarque préliminaire qui va alléger pas mal le code : virer tous les <span style="background:#FFFFFF"> qui ne servent à rien puisque la couleur déclarée dans le body est déjà blanche.

Sinon, un menu ne se fait pas avec des paragraphes normalement, mais plutôt avec une liste.

Pour fixer le menu, il y a différentes méthodes. Cela peut être un positionnement flottant, ou absolu (plus difficile à maitriser quand on débute)

Un petit exemple ce qui peut être fait :
http://css.mammouthland.net/mise-en-page-sans-tableau.php
Ou prendre un de ces gabarits :
http://www.alsacreations.com/static/gabarits/liste.html
0
Je suis désolé, mais je ne comprends vraiment rien, je suis un vrai débutant !

Je n'arrive même pas a comprendre le gabarit, j'ai fait plusieurs test et rien ne marche !

J'ai l'impression que je vais devoir repartir de zero, mais je ne sais même pas par ou commencer !

J'ai fixé mon menu à gauche, mais si je veux ajouter une image à droite, il me l'ajoute tout en bas
0
notobe Messages postés 1952 Date d'inscription mercredi 11 novembre 2009 Statut Membre Dernière intervention 8 juillet 2011 213
16 août 2010 à 20:24
Si vous ne comprenez rien au tuto, c'est effectivement qu'il faut commencer par le commencement et ne pas brûler les étapes. ;)

Étant donné que votre code html n'est pas foncièrement mauvais, il faut "juste" bien comprendre les CSS. Reprenez CSS débutant à partir de la home page http://css.mammouthland.net/

Sinon, il y a aussi le site du zéro https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3
0