Rechercher : dans
Par :

CSS simple Positionnement div & float

Dernière réponse le 11 jun 2009 à 13:13:53 Babybel54, le 9 jun 2009 à 15:52:38 
 Signaler ce message aux modérateurs

Bonjour,

Voilà mon problème est sur cette page : http://gotti.matthieu.free.f/oriffpl/liens.html
Quand on la regarde avec IE ça rend le résultat voulu, mais avec Firefox non.

Hier j'avais le problème inverse avec cette même page..
J'ai donc rajouter dans mon css:
overflow: hidden;
display:inline-block;
clear:both;

et cela donne ce résultat, quelqu'un peut il m'aiguiller pour que j'ai la même chose sur les 2 explorateurs, sans avoir à utiliser 2 styles différents (un pour IE et l'autre pour firefox).

voilà l'adresse de mon CSS : http://gotti.matthieu.free.fr/oriffpl/images/style.css

Merci d'avance pour vos réponses :)

Configuration: Windows 2003
Firefox 3.0.10

Meilleures réponses pour « CSS simple Positionnement div & float » dans :
Créer une DIV avec transparence VoirLes DIV transparents en CSS Vous voulez rendre une DIV transparente ? Rien de plus simple, il suffit d'utiliser une des techniques CSS suivantes : Rendre le DIV ainsi que le contenu transparent Le div lui même sera transparent, mais aussi...
Les CSS pour présenter vos images VoirPour présenter agréablement vos images, vous pouvez intégrer quelques codes supplémentaires dans votre CSS et vous en servir à bon escient. Elles sont bien sur modulables en fonction de la charte graphique de votre site. Utilisation Mettez les codes...
Popup en CSS, sans Javascript VoirVoici comment réaliser une popup d'information en pure CSS, sans Javascript. L'astuce est d'utiliser :hover de manière à utiliser des CSS différents au passage du curseur. Parmis les attributs CSS modifiés, on utilise display:none afin de...
DHTML - La notion de couche VoirQu'est-ce qu'une couche? Le DHTML est basé sur une fonctionnalité provenant de la norme 4.0 du HTML: les feuilles de style en cascade de positionnement, aussi appelée CSS-P (Cascading Style Sheets Positionning). Celles-ci permettent de définir des...
Positionner des éléments grâce aux CSS VoirIl est possible grâce aux feuilles de style de positionner au pixel près du texte ou des images grâce aux balises et . Cela est possible avec les versions 4 de Netscape et d'Internet Explorer, cependant cette technique reste hasardeuse...
Les classes de style (CSS) VoirLes classes et les ID Les classes Il peut s'avérer intéressant d'affecter des styles différents à des mêmes balises. Pour cela les spécifications CSS ont introduit le concept de classe. La définition des classes est aussi simple que celles des...

1

Dalida, le 9 jun 2009 à 18:24:58

Salut,

chez moi sous FF ça semble correct, as-tu réussi ?
[ Mathieu ]
Il y a sûrement des pandas pour ne dépendre de rien

Répondre à Dalida

2

Babybel54, le 11 jun 2009 à 08:51:46

Chez moi sous Firefox, ça me semble pas correct puisque chaque description est en dessous des images et que sur IE c'est à coté.

Je n'ai pas réussi ^^

Répondre à Babybel54

3

 Dalida, le 11 jun 2009 à 13:13:53

Salut,

sans IE c'est plus difficile à voir…
-;o)

si tu veux le texte à côté il faut enlever le {clear:both;} car il remet le bloc dans le flux alors que tu veux qu'il soit à côté (il annule le {float:left;} de l'image).
.liens_description_gauche {
clear:both;
color:#808080;
float:right;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:10px;
margin-top:5px;
text-align:justify;
vertical-align:bottom;
width:192px;
}
tu dois pouvoir faire beaucoup plus simple, donc plus stable avec quelque chose du genre :

<div class="liens_gauche">
	<p id="unapl">L'Union NAtionale des Professions LIbérales <a href="http://www.unapl.fr">www.unapl.fr</a></p>
</div>

et en CSS :
div.liens_gauche p{
	padding-left:80px;
	background-position:0 50%;
	background-repeat:no-repeat;
}
div.liens_gauche p a{
	display:block;
	text-align:center;
}
div.liens_gauche p#unapl{
	background-image:url(images/logo_unapl.jpg);
}
[ Mathieu ]
Il y a sûrement des pandas pour ne dépendre de rien

Répondre à Dalida