18100 sujets

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

Un overflow:hidden centré sur le bas ?

Bonjour,


Sur l'image suivante,

http://mumuri.free.fr/test/16.gif

J'aimerai n'afficher que la tête

Jusqu'à présent j'arrive bien à couper l'image, mais pas à "la remonter" pour pouvoir n'afficher que la tête

exemple 

<style>
div {
	height:23px;
	width:23px;
	overflow:hidden;
	background-position:bottom;
}
</style>

<div style="background:url('16.gif')" \></div>



Merci d'avance

André
Modifié par mumuri (14 Mar 2008 - 13:18)
tu emploie un logiciel de retouche d'image et tu coupe au dessus eventuellement tu rajoutes du gris au dessus en elargisssant le cadre de l'image apres coupe.

avec photoshop ou the gimp ( qui est gratuit ) ou un autre.

ensuite comment utiliser tel ou tel logiciel. ça depasse le cadre de ce site.
Modifié par CPascal (14 Mar 2008 - 13:26)
le but est de ne pas utiliser de logiciel !

le smiley doit rester tel quel en affichage classique et être coupé dans certains cas.

merci quand même
Modifié par mumuri (14 Mar 2008 - 13:32)
Salut,

<style>
div {
	height:23px;
	width:23px;
	background: url(http://mumuri.free.fr/test/16.gif) bottom center;
}

</style>

<div></div>


Ceci devrait marcher mais comme l'a fait remarquer CPascal c'est un drole de facon de faire...

Attention à ne pas mettre de ' autour de l'url dans le CSS.
Attention au \ qui traine dans la balise div.

Et si ton background-position n'est pas pris en compte c'est parce qu'il est ecrasé par le "background" de l'attribut style de la div (ou il aurai fallu mettre "background-image" si tu tiens vraiment à laisser un attribut style dans la balise.
Modifié par skywalk3r (14 Mar 2008 - 13:43)
merci beaucoup (l'astuce fonctionne)

Une petite explication s'impose, je cherche à modifier mon module de smileys, pour qu'il coupe automatiquement les images à une taille donnée, ceci pour éviter les débordements qu'on voir réguliérement sur des smileys à format "non standard".

une optimisation du style précédent sera de jouer sur :hover (ou mouseover) pour afficher le smiley complet quand on a la souris passe dessus (ceci sans déformer la mise en page).

en effet, ce n'est peut être pas courant, mais pas forcément idiot

Bonne journée
Modifié par mumuri (14 Mar 2008 - 14:02)
Sujet clos
Aller à