18073 sujets

Questions générales et questions de débutants

Une image qui "dépasse" d'une div...

Pages :
Bonjour à tous...

Dans ma quête de bannière pour mon nouveau site: http://sd970.sivit.org je voudrais faire une bannière sympa qui dépasse de la place qui lui est attribuée.
en gros, le Logo dépassera de la bannière, en haut, en bas et sur le coté droit.
J'aimerai savoir si il est possible en CSS que cette image dépasse de la place allouée à ma div, et si oui, comment faire?

Merci!

Julien
Modifié par julien51 (07 Jul 2005 - 09:53)
Administrateur
background-position et un déplacement négatif si j'ai bien compris le problème? (réaliser un clipping)
Merci de vos aides...
Sous Firefox, ca marche nickel, comme sous Safari... mais sous explorer, ca fait tout moche... en fait, il ne place pas l'image correctement et de supporte pas non plus la transaparence... comment faire?

Merci
IE ne supporte pas la transparence png par défaut.

Il faut utiliser une sombre propriété filter en css.
C'est à dire... ? Commen dois-ja faire?

Merci de ton aide, désolé pour la trivialité de mes questions!
Il existe des scripts tout fait mais qui sont très lourds et qui ne fonctionnent que pour des img (<img>) mais pas pour les arrière plan.

Si tu veux, regarde le code de ce site :

http://www.labordure.com

J'ai utilisé une méthode "perso" mais je trouve que ça reste très léger et que ç a fonctionne très bien Smiley smile
Aie... je suis désolé, j'ai beau regarder, je ne comprends pas très bien...
Quelle image est transparente?

De mon coté j'utilise un img, pas un background, donc la solution "lourde" devrait marcher, non?
Ha ok Smiley cligne

Alors tu rajoute :

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='uri de ton image');


par exemple comme ceci

<img style="le code ici dessus" ... />
? Je ne comprends pas... ?!?

Montrer mon code? Le copier ici?

Je visualise avec Crazy Browser sur un PC sous Windows 2000...
Alors, le site: http://sd970.sivit.org/

La bannière en haut est ce sur quoi je bosse maintenant, l'idée est d'obtenir ça:

upload/2193-Image1.png

Le truc, c'est qu'avec IE (crazy Browser), j'obtiens ça: upload/2193-ie.png


Pour finir, voici le code HTML au niveau de cette image:
[...]<div id="logo" title="Logo job &eacute;tudiant">
							<img src="/styles/logo.png" id="logo-image" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/styles/logo.png',sizingMethod='scale');" /> [...]



voila, j'aimerai donc savoir comment changer cela!
Modifié par julien51 (07 Jul 2005 - 13:42)
Mais montre le code que tu as utilisé, ...

Parce que la solution que je t'ai donné fonctionne donc bon c'est qu'il y a une erreur quelque part ...
Le mieux serait que tu mette l'image en arrière plan du div "header".

Ensuite tu donne aux navigateurs "conforme" le code suivant :

#header[id]{
background: url(url) no-repeat top;
}


et pour ie

#header{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='src');
}
TriadPtale a écrit :
Ensuite tu donne aux navigateurs "conforme" le code suivant :

#header[id]{
background: url(url) no-repeat top;
}



Vraiment ? Smiley eek
Modifié par Laurent Denis (07 Jul 2005 - 13:54)
Je suis désolé, mais je n'arrive pas à obtenir ce qu'il faut.


J'ai donc ca au niveau de mon code:

<div id="logo" title="Logo job &eacute;tudiant">	
[...]
</div>

et ca au niveau de ma CSS:

#logo {
	position: relative;
	height: 169px;
	clear: both;
	background: url("/styles/logo.png") no-repeat top;
	background-position: -1px;
	z-index: 10;
}


La, c'est l'image qui ne veut plus dépasser en dehors de ma div.... Smiley confus

et quand tu dis que je donne du code particulier à IE, comment je fais? Je mets tout dans ma CSS, mais comment dire à IE "tiens, ca c'est pour toi" et aux autres "regardez pas ça... c'est juste pour IE"".... ?

[ edit ] Sur ce site: http://css-astuces.batraciens.net/ajuster-image-de-fond.htm il est dit dans la partie "Commentaires" que l'image de fond ne peut dépasser de la div... or, c'est ce que je cherche. Comment faire? avec un <img>? C'est ce que j'avais, mais j'ai du changer car pour IE, la transparence des PNG c'est pas ça! et la transparence en GIF, ca marche sous IE?

Ju
Modifié par julien51 (07 Jul 2005 - 16:56)
Pages :
Sujet clos
Aller à