Comment: remplacer le title par une image

Fernand :

Excusez-moi d'arriver si tard dans cette discussion, j'étais pris à l'extérieur (le congrès de l'organisme pour lequel j'ai réalisé un site le mois dernier !)

Je crois que la solution à votre problème consiste simplement à faire de la place pour l'image dans le padding de l'ancre du titre pour la rendre réactive.

Par exemple, dans le code suivant, j'affiche à la fois le titre et une image carrée de 75px à sa gauche. L'image est rendue visible et positionnée par le padding de l'ancre, en conjonction avec les autres réglages.

#header_title { 		/* appears at the top of every page -- see template script */
	position: absolute;
	top: 0;			/* use anchor padding to place header_title text, to leave room for header_image */
	left: 10px;		/* offset for header_image as well as header_title text */
	margin: 0; 		/* needed for IE Mac */
	padding: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif; /* to make sure it does not inherit something else */
	font-size: 30px; 	/* not to be resized by browser */
	font-weight: bold;
	background: transparent url("images/header_image.png") 0px 2px no-repeat; /* to set and position header_image */
}

#header_title a { 		/* link to the home page */
	display: block; 	/* to add margins and padding */
	position: relative;
	padding: 10px 0px 35px 90px; /* left padding makes room for header_image width, vertical padding plus font-size equals header_image height */
	color: #36a; 		/* set to "even" color to display text of title or to background color to hide it */
}

Si je veux afficher seulement l'image, sans le texte du titre, je règle font-size à zéro dans le header_title et j'augmente le padding vertical pour compenser, par exemple en fixant le bottom-padding de l'ancre à 65px (35px originellement + 30px de la hauteur de la police disparue). Notez qu'on peut tout aussi bien modifier le top-padding, l'important c'est que le total du padding vertical fasse place à l'image. Enfin, je règle la couleur de l'ancre à la couleur du fond (pour éviter qu'IE affiche un petite tache de couleur là où aurait normalement vu le texte du titre).

Tout ça en CSS, sans toucher template.php.

Donnez-m'en des nouvelles.