Flux rss
Rechercher : dans
Par : Pertinence Date Nom d'utilisateur
Statut : Non résolu

[CSS] Placer image en haut d'une page

Antoine, le jeudi 17 avril 2008 à 18:52:24
Bonjour,

Je cherche à placer une image tout en haut d'une page html, mais le problème c'est qu'avec le code que j'ai, elle ne se place qu'à quelques mm du haut, et donc il y a un petit trou que j'aimerais bien voir disparaître.

L'image est incluse par CSS dans le fond d'écran d'un DIV et doit théoriquement servir au design de la page.

Voici le code:

.div-haut {
background-image : url("../images/decoupes/haut.jpg");
width : 798;
height : 145;
margin-top : 0;
}

Le code Html est lui tout simplement <div class="div-haut">Hello</div>

Merci d'avance pour votre aide,
Antoine
Répondre à Antoine  Signaler ce message aux modérateurs Aller au dernier message

1


  • 1    Ce message vous semble utile, votez !
  • Ce message ne vous semble pas utile, votez !
  • Signaler ce message aux modérateurs
Dora The Explorer, le jeudi 17 avril 2008 à 19:10:59
Salut !

Pour commencer, le code serait pas plus propre avec un: 
<div id="div_haut">


Et donc un: 
#div_haut{
...
}


Ensuite, tu devrais essayer d'enlever les marges du body: 
body{
margin-top:0;
}

#div_haut{
padding-top:0px;
}

Après, je débute et ça fait longtemps que j'y ai pas touché, et toujours eu du mal avec les marges, etc. Mais quelqu'un devrait te dire ça mieux... ou te dire tout le contraire ;)) "Vous avez beaucoup d'avenir derrière vous..."
Comment qu'ça marche là dis-donc.
   
Répondre à Dora The Explorer

2


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Dalida, le jeudi 17 avril 2008 à 19:13:39
salut,

+1

au passage tu peux nettoyer <html> en plus 
html, body, div#div_haut
{
margin-top:0;
padding-top:0;
}
[ Mathieu ] 
Il y a surement des pandas pour ne dépendre de rien
   
Répondre à Dalida

3


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Antoine, le jeudi 17 avril 2008 à 19:33:18
:)

Merci tous les deux!

Ca marche nickel maintenant, tout est bien comme je voudrais ;)

Cependant, j'aimerais savoir si l'utilisation de l'ID est vraiment plus appropriée que la classe, ou pas?

Sinon, merci beaucoup pour votre aide !!!

Antoine
   
Répondre à Antoine

4


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Dalida, le jeudi 17 avril 2008 à 19:36:03
et hop, un peu de lecture !

et je ne sais plus si ils le disent là, mais un 'id' confère un poids de 100 et une classe un poids de 10 pour les priorités de rendu.

donc tu utilises toujours les 'id' sauf quand tu doit l'appliquer à plusieurs éléments, dans ce cas c'est une 'class'.
[ Mathieu ] 
Il y a surement des pandas pour ne dépendre de rien
   
Répondre à Dalida

5


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Dora The Explorer, le jeudi 17 avril 2008 à 19:39:54
J'en profite pour remercier Dalida pour la confirmation et l'allègement visuel du code.

Disons que la class te permet d'attribuer des propriétés à n'importe quelle balise via le CSS. Mais un div suffit largement dans ton cas. On le nomme avec id et on utilise donc son #id dans le css. Tu peux mettre <p class="introduction"> par exemple, mais le div n'a pas besoin de class. L'id remplace en quelque sorte le class, puisque, grâce à l'id, ce n'est pas tous les divs, mais seulement un qui aura ces propriétés.

Si ça marche, tant mieux, mais je trouve ça de toute façon plus clair juste avec le div, et c'est sûrement pas valide w3c avec le "class".

EDIT: oulah, je ferais bien d'aller me relire ça, moi aussi, je crois ;) "Gériendi" ;)) "Vous avez beaucoup d'avenir derrière vous..."
Comment qu'ça marche là dis-donc.
   
Répondre à Dora The Explorer

6


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Antoine, le jeudi 17 avril 2008 à 19:43:35
Merci pour les infos, je vais utiliser l'ID comme ca.

Bonne soirée à vous deux,

Antoine
   
Répondre à Antoine

7


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Dalida, le jeudi 17 avril 2008 à 19:44:47
oulalaaaaaaaa !!!
tu vas nous le copier cent fois, ça !!!
-:oþ

allez hop, pour toi ce sera la version brute !
et toc !
-;o)
[ Mathieu ] 
Il y a surement des pandas pour ne dépendre de rien
   
Répondre à Dalida

8


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Dalida, le jeudi 17 avril 2008 à 19:46:31
<edit>

petit doublon…
(ô_O)'

</edit> [ Mathieu ] 
Il y a surement des pandas pour ne dépendre de rien
   
Répondre à Dalida

9


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
 Dora The Explorer, le jeudi 17 avril 2008 à 20:33:33
M'en fous, f'rai pas mes devoirs ;)
Dès que j'essaye de m'y remettre, je passerai sur les liens...

A+ ;)) "Vous avez beaucoup d'avenir derrière vous..."
Comment qu'ça marche là dis-donc.
   
Répondre à Dora The Explorer
Posez votre question Répondre
SVP placer images dans emails (Résolu)Bonjour, J'ai demandé conseil pour placer des images...ici > http://www.commentcamarche.net/forum/affich 7443613 placer image animee ds email#1 Quelqu'un pourrais m'aider? Merci! _________________________________________________________... www.commentcamarche.net/forum/affich-7464998-svp-placer-images-dans-emails
Comment mettre un fond de page sur une CSS ? (Résolu)Bonjour, je suis en train de realiser un site et j ai defini une image de fond ma css. background-image:url() La manipulation marche qd j execute ma page ac firefox en local mais des je vais la visualiser en ligne, il n'y a pas l'image de... www.commentcamarche.net/forum/affich-3977287-comment-mettre-un-fond-de-page-sur-une-css
Plus d'images sur les pages web (Résolu)bonjour alors mon probleme est le suivant: toute les images de pages webs ne s'affiches plus ce qui as la place c'est un petit carré avec un croix rouge a l'interieure est-ce normal? renseigné moi svp!!!! est-ce le web qui foire ou le... www.commentcamarche.net/forum/affich-2162494-plus-d-images-sur-les-pages-web
Les CSS pour présenter vos imagesPour présenter agréablement vos images, vous pouvez intégrer quelques codes supplémentaires dans votre CSS et vous en servir à bon escient. Elles sont bien sur modulables en fonction de la charte graphique de votre site. Utilisation Mettez les codes... www.commentcamarche.net/faq/sujet-9100-les-css-pour-presenter-vos-images
About:blank - Page de démarrage remplacée"Ma page de démarrage a été remplacée par une autre. J'ai beau restaurer mes réglages dans les options d'Internet Explorer, l'autre page revient." Vous êtes victime d'une forme de malveillance appelée Hijack ( hijacking ). Certains de ces hijack... www.commentcamarche.net/faq/sujet-64-about-blank-page-de-demarrage-remplacee
[Webmaster] Adapter un site à toutes les résolutions, le centrerUne question récurrente sur ce forum est "Comment adapter mon site à la résolution du visiteur ? Quelle résolution choisir ?" Pas besoin de se compliquer la vie pour ça ! Comment faire Il suffit d'appliquer une largeur relative (=qui change selon... www.commentcamarche.net/faq/sujet-4613-webmaster-adapter-un-site-a-toutes-les-resolutions-le-centrer
Problème de picto (Résolu)bonjour, j'ai un pictograme qui s'affiche n'importe où c'est à dire à la place d'une image, d'une photo où lorsque je visite un site j'ai un picto à la place de la page normale ce picto se présente ainsi : un... www.commentcamarche.net/forum/affich-2090850-probleme-de-picto
Images/lien/hover/css (Résolu)Bonjour, comment fonctionne le principe en css des images qui servent de lien et qui sont doubles. je m'explique : xxxxxxxxxxxxxxx x image haut x xxxxxxxxxxxxxxx x image bas x xxxxxxxxxxxxxxx par défaut, on voit image haut. lorsque l'on... www.commentcamarche.net/forum/affich-4142572-images-lien-hover-css
Lien vers page précédente ouvre nouvel onglet (Résolu)Bonjour, Je ne parviens pas à faire fonctionner mon lien vers une page précédente. Le lien est placé sur une page php de réponse à un formulaire envoyé. Je souhaite que les visiteurs puissent revenir là où ils se trouvaient sans faire précédent dans... www.commentcamarche.net/forum/affich-5173334-lien-vers-page-precedente-ouvre-nouvel-onglet
Télécharger PDFLabPDFLab vous permet de diviser et assembler des documents PDF ainsi que d'y insérer des images, des pages blanches. Vous pourrez également très facilement créer des documents PDF à partir d'images. Télécharge une image disque (fichier... www.commentcamarche.net/telecharger/telecharger-34055028-pdflab
Télécharger Moo0 ImageThumbnailerLes images disponibles sur Internet; notamment dans les pages Web, ne sont pas toujours dans leur taille d'origine, ce sont des aperçus. Cela permet de gagner de l'espace sur une page dons la possibilité d'y placer plusieurs images à la fois. Moo0... www.commentcamarche.net/telecharger/telecharger-34056613-moo0-imagethumbnailer
Télécharger Picture2LifeLes images se trouvant sur les pages Web ou les sites Web ne sont pas modifiables sur place. Il faut que vous enregistriez l'image sur votre disque dur et après seulement vous pourriez l'éditer. Picture2Life est une extension du navigateur Firefox.... www.commentcamarche.net/telecharger/telecharger-34056274-picture2life
Toutes les réponses pour « [CSS] Placer image en haut d'une page »