HTML, positionner son image au sommet du site

Résolu/Fermé

xT1G3Rx Messages postés 67 Date d'inscription mercredi 24 décembre 2014 Statut Membre Dernière intervention 26 mai 2015 - 30 janv. 2015 à 03:14
xT1G3Rx Messages postés 67 Date d'inscription mercredi 24 décembre 2014 Statut Membre Dernière intervention 26 mai 2015 - 9 févr. 2015 à 05:06

Comme le dit le titre, j'aimerai positionner mon image au sommet de mon site web, en effet, j'ai utilisé une balise ( <img> ) avec but de la positionner au sommet de mon site web et de mettre mon menu par dessus, mais il a un espace entre le sommet de la page et mon image ( environ 8px ). Je ne sais pas si c'est à cause de mon navigateur ( Firefox ) ou tout simplement mon code source, merci de me répondre ;)

A voir également:

HTML, positionner son image au sommet du site
Site de telechargement - Guide
Site inaccessible - Guide
Site de vente entre particulier - Guide
Image iso - Guide
Editeur html - Télécharger - HTML

6 réponses

Réponse 1 / 6

DerkoFR Messages postés 504 Date d'inscription vendredi 7 novembre 2014 Statut Membre Dernière intervention 5 janvier 2017 74
30 janv. 2015 à 09:01

Bonjour,

C'est tres simple passe moi ton code je te fait un tutoriel ;)

HTML + CSS

xT1G3Rx Messages postés 67 Date d'inscription mercredi 24 décembre 2014 Statut Membre Dernière intervention 26 mai 2015 6
1 févr. 2015 à 06:36

Voici mon code:

<!doctype html"
<html>
<head>
<title>Spiritrevolution</title>
<meta charset="utf-8">
</head>
<body>
<style>
body {
background-image:url("image/fond.jpg");
}
#logo
{
height: 141px;
padding-top: 0px;
position: relative;
top: 0px;
left: 250px;
horizontal-align: middle;

display: non
}
ul#menu_horizontal li {
display : inline;
padding : 0 0.5em;
}
ul#menu_horizontal {
list-style-type : none;
}
#menu_horizontal a {
color: white;
}
#menu_horizontal a:hover {
color: #C8E8FF;
}
#menu_horizontal {
background-color: #4eb9f9;
weight: 1164px;

}
</style>
<img src="image/spiritrevolution.jpg" id="logo">
<ul id="menu_horizontal">
<li><a href="accueil.php">Accueil</a></li>
<li><a href="news.php">News</a></li>
<li><a href="livreor.php">Livre d'or</a></li>
<li><a href="contact.php">Contact</a></li>
<li><a href="admin.php">Admin</a></li>
</ul>

Oui quelque instructions css ne servent à rien ( simples tests )

Réponse 2 / 6

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
30 janv. 2015 à 11:14

Salut,

Les navigateurs peuvent effectivement avoir par défaut des marges sur le contenu de ta page.
Tu peux essayer de réinitialiser ces marges en css comme ceci :

html, body {
    margin: 0;
    padding: 0;
}

Bonne journée

DerkoFR Messages postés 504 Date d'inscription vendredi 7 novembre 2014 Statut Membre Dernière intervention 5 janvier 2017 74
30 janv. 2015 à 11:44

Bonjour pitet

Il veut mettre juste une images en haut il peut faire

<img id="Imageenhaut" href"lien/lien"> </img>

Est dans son css

#imageenhaut {
margin: 0;
padding: 0;

}

xT1G3Rx Messages postés 67 Date d'inscription mercredi 24 décembre 2014 Statut Membre Dernière intervention 26 mai 2015 6
1 févr. 2015 à 06:34

j'ai essayé :(

Réponse 3 / 6

xT1G3Rx Messages postés 67 Date d'inscription mercredi 24 décembre 2014 Statut Membre Dernière intervention 26 mai 2015 6
8 févr. 2015 à 19:57

Alors ??

Réponse 4 / 6

codeurh24 Messages postés 761 Date d'inscription samedi 29 mars 2014 Statut Membre Dernière intervention 8 septembre 2018 123
8 févr. 2015 à 20:12

bonsoir,

ça choque personne que le style soit dans le body ?

xT1G3Rx Messages postés 67 Date d'inscription mercredi 24 décembre 2014 Statut Membre Dernière intervention 26 mai 2015 6
9 févr. 2015 à 05:01

Habitude personelle :p

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 6

codeurh24 Messages postés 761 Date d'inscription samedi 29 mars 2014 Statut Membre Dernière intervention 8 septembre 2018 123
Modifié par codeurh24 le 8/02/2015 à 20:44

font-weight:bold;
a la place de weight: 1164px;

display: none;
a la place de display: non

vertical-align: middle;
a la place de horizontal-align: middle;
mai si c'est de l'horizontal c'est plutot text-align: center meme pour une image

Réponse 6 / 6

codeurh24 Messages postés 761 Date d'inscription samedi 29 mars 2014 Statut Membre Dernière intervention 8 septembre 2018 123
8 févr. 2015 à 20:58

Evidemment vue le niveau technique tu code, tout est a recommencer car par la suite tout vas devenir bancal.

Voici le code amélioré a partir du tient:

<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Spiritrevolution</title>
<style>
body {
background-color:#000;
margin:0px;
padding:0px;
}
#logo
{
height: 141px;
padding-top: 0px;
position: relative;
text-align: center;

}
ul#menu_horizontal li {
display : inline;
padding : 0 0.5em;
}
ul#menu_horizontal {
list-style-type : none;
margin: 0px 0px 0px 0px;
}
#menu_horizontal a {
color: white;
}
#menu_horizontal a:hover {
color: #C8E8FF;
}
#menu_horizontal {
background-color: #4eb9f9;
font-weight: bold;

}

#header{
text-align: center;
}

#nav{
text-align: center;
}
</style>
</head>
<body>

<div id="header">
<img src="http://spiritrevolution.free.fr/images/flymaxi.jpg" id="logo" />
</div>
<div id="nav">
<ul id="menu_horizontal">
<li><a href="accueil.php">Accueil</a></li>
<li><a href="news.php">News</a></li>
<li><a href="livreor.php">Livre d'or</a></li>
<li><a href="contact.php">Contact</a></li>
<li><a href="admin.php">Admin</a></li>
</ul>
</div>
</body>
</html>

xT1G3Rx Messages postés 67 Date d'inscription mercredi 24 décembre 2014 Statut Membre Dernière intervention 26 mai 2015 6
9 févr. 2015 à 05:06

Merci !

Discussions similaires

Retrouver l'image originale après avoir fait des modifications ?

'Votre colis est dans le site de livraison qui dessert votre adresse' que faire

positionner une image dans une page html

Colis en cours de transport vers votre site de livraison ?

Discussions similaires

Newsletters