[CSS] problème de centrage d'une image [Fermé]

Signaler
Messages postés
9
Date d'inscription
mercredi 11 février 2009
Statut
Membre
Dernière intervention
16 mars 2009
-
s.spark
Messages postés
2502
Date d'inscription
vendredi 29 octobre 2004
Statut
Contributeur
Dernière intervention
13 février 2018
-
Bonjour,

J'ai une image dans un div:

<div id="bh"><img src="barre_haut.jpg"/></div>

avec une feuille css jointe:

#bh {
position:relative;
width: 100%;
height: 100%;
top:0%;
left:0%;

}

Alors comment dois je faire pour centrer l'image, sachant qu'elle est très longue. Là l'image commence à gauche et s'arrete beaucoup trop loin à droite.. Donc elle serait centrée dans l'écran par rapport au centre de l'image ;)

Et est ce que le absolute est ce quil convient le mieux ? car du coup il y a un scrollbar qui apparait en dessous (pour voir l'image dans son entierté alors que finalement elle joue un peu un role de background..

Merci beaucoup !!

Doc.

7 réponses

Messages postés
2502
Date d'inscription
vendredi 29 octobre 2004
Statut
Contributeur
Dernière intervention
13 février 2018
550
Salut,

Tu sembles vouloir faire plein de chose avec cette image, déjà, comment on centre une truc qui est plus grand que la page ? Je peux mettre mon doigt au centre de mon écran, mais pas mon écran au centre de mon doigt :p
Tu veux quoi, centrer la scroll barre ?

Centrer verticalement, je sais pas comment tu pourrais faire, la hauteur n'a pas de limité, on ne peut pas centrer sur quelque chose d'infini, donc il faut définir une auteur ou une marge prédéfini en haut, juger au mieux

De toute façon, 0 contexte, 1 000 000 de réponses.


Je me contenterais de ça :
<img style="width: 100%" src="barre_haut.jpg"/>
http://www.alsacreations.com/...

tu y apprendras bcp sur ce site et tu ne feras plus ton CSS par hasard ...
Messages postés
9
Date d'inscription
mercredi 11 février 2009
Statut
Membre
Dernière intervention
16 mars 2009
2
Ouai je connais, c'est très bien pour apprendre mais plus compliqué pour trouver des choses précises :p

mais S.spark, tu n'as pas trop bien compris :) Ce que je veux dire c'est que l'image (qui est en faite une longue barre, qui commence par le milieu avec un dégradé radian) soit centrée par le milieu.

En fait j'ai mis une image en repeat-x (donc ça fait une sorte de bande qui carctérise l'emplacement du menu), par le dessus j'y ai mis la longue image. mais le centre de l'image n'est pas au centre de l'écran.

Le but ici n'est pas de voir toute l'image, mais seulement ce qui est possible de voir selon la résolution. Donc si quelqu'un avec une plan grande résolution arrive, l'image sera toujours centrée par sont milieu, mais il la verra plus.

Et le dégradé fini par se fondre dans la bande fait d'image en repeat-x..

Je sais pas si j'ai bien expliqué ^^
Messages postés
9
Date d'inscription
mercredi 11 février 2009
Statut
Membre
Dernière intervention
16 mars 2009
2
Donc aussi je veux pas de scrollbar :s et j'ai essayé de faire un position:static; mais l'image disparait.. :(
Messages postés
9
Date d'inscription
mercredi 11 février 2009
Statut
Membre
Dernière intervention
16 mars 2009
2
C'est possible au moins ?
Messages postés
2502
Date d'inscription
vendredi 29 octobre 2004
Statut
Contributeur
Dernière intervention
13 février 2018
550
A ce moment là ton image doit être en background en CSS, tu ne doit pas utiliser une <img />