28173 sujets

CSS et mise en forme, CSS3

Décalage images sous FF et IE

Bonjour,

Tout d'abord, je vous remercie de votre aide.

J'ai terminer une page type, qui s'affiche bizzarement sous IE.
J'ai mis trois vignettes, espacées de 10px entre elles.
1) la marge de gauche ne correspond pas
2) la marge haut-bas non plus.

L'affichage sous FF est correct, mais pour y voir plus clair et comprendre qqch voici le lien:
http://www.vitamine-c.ch/famille/essai.html

Merci de votre aide

Protéine
Bonsoir Protéine,
Je ne vois rien de défini pour les images sont tu parles.
Pourrais tu donner plus de précision?
Fais gaffe au plagiat quand même, ton identité graphique je l'ai déja vu
quelquepart sur un site qui repertorie les plus beaux sites en CSS. Smiley cligne
Si je l'ai vu c'est que d'autres personnes pourront le voir à leur tour.

Sympathique la transition sur fond noir semi transparent aprés le
clic des vignettes. Comment obtiens tu ça?
Salut Hermann,

Le truc pour les photos:
http://huddletogether.com/projects/lightbox2/

Concernant la mise en page, j'ai repris la base d'un site existant pour un site à but non lucratif (famillliale) et modifié et adapté par mes soins.

J'ai par ailleurs mis en ligne uniquement le problème maintenant. Smiley cligne

Mon soucis est le suivant :
Mes 3 images n'apparaissent pas la même chose sous IE et FF ( déclalage à gauche plus grand et marge en bas plus grand sous IE)
Pourquoi?

FF est correcte, opéra est OK mais IE débloque.

Merci pour votre aide... Smiley biggrin

Protéine
Lien
http://www.vitamine-c.ch/famille/essai.html
Modifié par proteine (13 Jul 2006 - 15:25)
Tu compliques un peu...
Pourquoi mettre tes images dans des div?
ça peut tout aussi bien fonctionner avec:

		<div class="propos">
             <a href="http://www.vitamine-c.ch/famille/images/image.jpg" rel="lightbox"><img src="alex1001.jpg" width="50" height="50" alt=" alex" title="super alex" /></a>
			 <a href="http://www.vitamine-c.ch/famille/images/image.jpg" rel="lightbox"><img src="alex1001.jpg" width="50" height="50" alt=" alex" title="super alex" /></a>
			 <a href="http://www.vitamine-c.ch/famille/images/image.jpg" rel="lightbox"><img src="alex1001.jpg" width="50" height="50" alt=" alex" title="super alex" /></a>			
			 </div>


puis 

.propos {margin-left: 55px;}
.propos img{
	float: left;
	margin-right: 10px; 
	}

La marge gauche plus importante est un bug IE :
http://www.positioniseverything.net/explorer/doubled-margin.html
Modifié par Hermann (13 Jul 2006 - 20:04)
Merci hermann,

Il reste un seul problème, la marge en bas Smiley confus
ça vient peut-être de 
<div class="clr">
			</div>

Qu'en penses-tu?

Merci de ton aide Smiley smile
Smiley cligne
Merci Hermann, j'ai créer un petit hack pour IE !

J'ai un dernier problème avec mes titres et la bordure supérieur ::
Sous IE, la bordure "colle" aux vignettes, ( regardez entre " mes Hobbys et mes favoris" , espace plus grand.
Cela vient-il du hack?
Merci pour vos réponses qui éclairont, je l'espère ma lanterne forte éteinte.
Smiley sweatdrop
lien:
http://www.vitamine-c.ch/famille/essai.html

Smiley smile Smiley biggrin
Modifié par proteine (15 Jul 2006 - 18:35)
Sujet clos
Aller à