Image en background ou dans le html ?

Bonjour à tous,

Débutant en css, je donne un coup de main à un ami pour la réalisation d'un petit site.

Avant de partir dans la mauvaise direction j'aimerais avoir votre avis.

Je vais avoir un div entete
un div corps
un div footer

dans le div corps je dois avoir une image (logo entouré d'un rond) et de par exemple deux liens -> voir image exemple


Je souhaite que cette image soit en milieu de page avec les différentes résolutions d'écran.

Si je la mets en background avec un position center cela fonctionne mais comment faire pour que mes liens soit toujours placé à la même distance du logo quand on diminue la fenetre par exemple.

Ne faut il pas mieux insérer l'image dans la page html mais comment faire dans ce cas pour que le texte chevauche un peu mais TOUJOURS en se trouvant à la même distance du logo

Espérant que je me suis fait comprendre

Bon dimanche à tous

Bonjour,

Le choix entre une image de fond ou une balise HTML dépend de la fonction de l'image :
http://www.alsacreations.com/astuce/lire/62-balise-ltimggt-ou-feuille-de-style-css.html

Dans le cas d'un logo, c'est forcément une image qui apporte du sens, donc une <img>. Tu peux ensuite placer tes contenus "un peu au-dessus" en jouant avec la position relative par exemple.

salut,
ce sont les b.a.-ba du positionnement CSS. Tu pourrais passer par une structure simple

	<header>
		<a href=""></a>
		<img src="" alt="" />
		<a href=""></a>
	</header>

qui te permettrait de passer par un simple "text-align:center" sur ton <header> et puis tu alignerais verticalement tous tes éléments

header {text-align:center;}
header a, header img {display:inline-block;vertical-align:middle;}

Tout d'abord merci de vos réponses rapides !

Donc je place mon image et je crée des id pour venir superposer le texte en relatif si j'ai bien compris.

Je tente

Dans ce cas la je mets des top et left en négatif dans le positionnement relatif de mes liens pour qu'ils viennent en superposition du logo et non au dessous ? enfin ca marche mais est-ce la bonne méthode ?

aurais tu zappe la réponse de Zelalzan http://forum.alsacreations.com/posting.php?action=newp&tid=70548&fid=4&p=1#p471523 ?

Non je n'ai pas zappé sa réponse,
j'ai été voir son lien, j'en ai déduit qu'il fallait mieux que mon image soit dans le html

je ne comprends pas cette remarque

Salut,
il n'y a pas de lien dans la réponse de Zelalsan, il y a juste une réponse qui correspond exactement à ce que tu souhaites faire ( une image en header qui reste au milieu et avec 1 lien de chaque coté de l'image )

J'ai cru que tu parlais de l'autre réponse

Non je n'ai pas zappé sa réponse non plus, j'ai remercié les deux et j'ai appliqué sa méthode

J'ai juste demandé ensuite si les placements en négatifs n'étaient pas "contre nature"
Modifié par zorg74 (27 Jan 2014 - 21:19)

zorg74 a écrit :
J'ai juste demandé ensuite si les placements en négatifs n'étaient pas "contre nature"

Non ce n'est pas péché et c'est même le CSS pour tous .
Plus sérieusement c'est généralement révélateur d'une mauvaise maîtrise de ce que l'on fait mais il y a des cas où on est obligé de passer par ça. Il n'y a rien qui l'interdit vu que c'est possible.
Par contre avec l'exemple que j'ai donné, l'alignement vertical se fait normalement d'une manière centrée. Tu peux l'ajuster en pixels toujours avec "vertical-align".

comme j'ai dit, je découvre le css
(ou comment se prendre la tête pour rendre service à un pote)

ok, merci je vais regarder cela de plus près