28173 sujets

CSS et mise en forme, CSS3

Bonjour,

Je suis depuis quelques heures coincées sur le problème d'affichage d'une div en bas en droite de ma fenêtre.

Les critères de cette div :

- Alignement en bas à droite de la page.
- Pas de problème lors du changement de la taille de la fenêtre.
- Reste en position (totalement en bas à droite) si je scroll dans la page.
- J’aimerais de préférence ne pas utilisais le script suivant : http://forum.alsacreations.com/topic-1-12599-1-Image-qui-suit-la-scrollbar.html
- Compatibilité de la page sur IE et FF naturellement, mais je pense que cela va de soi.


EDIT : Je pense qu'il faut donc enlever cette div du flux de la page. Mais l 'attribut "fixed" n'est pas compatible avec tous les Browsers...


Merci d’avance pour votre aide,

Cordialement, Smiley confus
Modifié par Dj.Ango (30 Jan 2008 - 15:56)
Pour tous les navigateurs modernes (dont IE7):
[b][#black]HTML[/#][/b]

<p>Ma boîte</p>


[b][#black]CSS[/#][/b]

p {position:fixed; bottom:0; right:0;}

Pour IE6, on pourra jouer sur une dégradation gracieuse en attribuant par commentaires conditionnels une position absolue à la boîte voulue.
Hello Dj.Ango,

Je crois que tu trouveras pléthores de méthodes et d'explications pour "émuler" la position fixe pour IE lt IE7 sur ce site :
http://www.amaryllidaceae.org/web-jardin/CSS/IE-fixed.htm
Certaines fonctionnent, d'autres non, certaines sont discutables et discutées...à toi de voir Smiley cligne
N'hésites pas à parcourir les liens et à revenir discuter de la méthode que tu auras choisie Smiley smile
Merci pour votre aide,


J’ai finalement utilisé ceci

		<?php echo '<link rel="stylesheet" type="text/css" media="screen" href="style/' . $css . '/style.css" />'; ?>
		<?php
			
			//Connaître le navigateur du client
			
			/*if ((ereg("Nav", getenv("HTTP_USER_AGENT"))) || (ereg("Gold", getenv("HTTP_USER_AGENT"))) ||
			(ereg("X11", getenv("HTTP_USER_AGENT"))) || (ereg("Mozilla", getenv("HTTP_USER_AGENT"))) ||
			(ereg("Netscape", getenv("HTTP_USER_AGENT")))
			AND (!ereg("MSIE", getenv("HTTP_USER_AGENT"))) AND (!ereg("Konqueror", getenv("HTTP_USER_AGENT"))))
			  $navigateur = "Netscape";
			elseif (ereg("Opera", getenv("HTTP_USER_AGENT")))
			  $navigateur = "Opera";*/
			if (ereg("MSIE", getenv("HTTP_USER_AGENT")))
			  $navigateur = "MSIE";
			/*elseif (ereg("Lynx", getenv("HTTP_USER_AGENT")))
			  $navigateur = "Lynx";
			elseif (ereg("WebTV", getenv("HTTP_USER_AGENT")))
			  $navigateur = "WebTV";
			elseif (ereg("Konqueror", getenv("HTTP_USER_AGENT")))
			  $navigateur = "Konqueror";
			elseif ((eregi("bot", getenv("HTTP_USER_AGENT"))) || (ereg("Google", getenv("HTTP_USER_AGENT"))) ||
			(ereg("Slurp", getenv("HTTP_USER_AGENT"))) || (ereg("Scooter", getenv("HTTP_USER_AGENT"))) ||
			(eregi("Spider", getenv("HTTP_USER_AGENT"))) || (eregi("Infoseek", getenv("HTTP_USER_AGENT"))))
			  $navigateur = "Bot";*/
			else
			  $navigateur = "Autre";
			// Affichage par exemple du navigateur
			// ou insertion dans base de données pour statistiques
			
			//affiche le navigateur
			
			if ($navigateur == 'MSIE')
			{
				echo '<link rel="stylesheet" type="text/css" media="screen" href="style/' . $css . '/style_ie.css" />';
			?>
      <!--[if IE 6]>
      <style type="text/css">
      #fixed {
        position: absolute;
        top:expression(body.scrollTop + document.body.clientHeight - 100 + "px");
        right: 0px;
        }
      </style>
      <![endif]-->
			<?php
			}
			else
			{
				echo '<link rel="stylesheet" type="text/css" media="screen" href="style/' . $css . '/style_ff.css" />';
			}
			?>