Caler une image dans un coin de la page

Bonjour ~ Bonsoir à tous,

Je souhaiterai savoir si il est possible de caler une image dans un coin de page HTML. Pour ma part, tentant d'avoir une présentation sortant de l'ordinateur, j'aurais voulu mettre mon logo dans un coin de la page, en bas de celle ci. Ce que j'entend par caler une image, c'est que je souhaiterai qu'elle ne soit pas simplement à la suite du contenu de ma page, mais bien en bas.

N'hésitez pas à me demander plus de précision si ce n'est pas assez clair,
Merci d'avance,
Exotiik.

Exotiik a écrit :
Ce que j'entend par caler une image, c'est que je souhaiterai qu'elle ne soit pas simplement à la suite du contenu de ma page, mais bien en bas.

En pied de page?

Ou tu veut que ton logo reste accrocher a ta page même quand tu la fait défiler de haut en bas?
Modifié par Yuril (20 Aug 2011 - 00:13)

Ça dépends des résolutions d'écran.....si j'ai bien compris

Exotiik, sois plus précis et on pourra t'aider

Yuril a écrit :

En pied de page?

Ou tu veut que ton logo reste accrocher a ta page même quand tu la fait défiler de haut en bas?

Oui voilà c'est ça. Je voudrais qu'elle reste coller en bas quoi que je fasse.

Je sais que la technique existe!
J'ai déjà vu ça sur des Menu qui rester en bord de page même quand tu descend dans la page.

mais je ne sais pas comment on fais

salut salut,

Tu peux eventuellement essayer :

div {
position: fixed;
}

Où div correspond au div incriminé, ici ton logo si j'ai bien compris. Ensuite tu le positionne avec les différentes possibilités offertes a toi.

En espérant t'avoir aidé.
Modifié par Gili (20 Aug 2011 - 12:47)

Bonjour,

Position:fixed;

Ouinn

Je viens d'avoir la triste confirmation, Laurie Anne m'ignore, ne pas répondre à mon harcèlement par MP je comprend, mais ignorer mes réponses sur le fofo, ça m'attriste réellement.

... c'est peut être à cause de mon orthographe snif

J'ai testé cela mais ça ne donne pas le résultat attendu.

Pour faire plus simple, voilà ma page : http://i42.servimg.com/u/f42/12/12/79/83/sans_102.png

En haut se trouve le logo dans sa position sans aucune modification, en bas se trouve le logo dans la position que je souhaite, c'est à dire dans le coin de la page, calé.

Salut salut,

ce que tu peux éventuellement faire :

#tonLogo {
position: absolute;
left: 0;
bottom: 0;
}

Qui positionnera hors du flux ton logo en bas à gauche. après si tu veux qu'il soit visible tout le temps à l'écran au lieu de mettre absolute tu met fixed :

#tonLogo {
position: fixed;
left: 0;
bottom: 0;
}

En espérant avoir pu t'aider.
Modifié par Gili (20 Aug 2011 - 15:49)

Oui c'est déjà mieux, le logo se cale tous seul.
Mais par contre, lorsque je réduit ma fenêtre, le logo vient se méler a mon texte. Il y a moyen d'éviter ça?

Ton conteneur(Ta div qui contient ton texte et ton image, si tu préfère...) doit être :

#mon_conteneur:position:relative;

#mon_conteneur img#tonLogo:
position: absolute; 
left: 0; 
bottom: 0; 
;

euh pardon

#mon_conteneur img#tonLogo: 
position: fixed;  
left: 0;  
bottom: 0;  

Après donne nous ta structure html, c'est mieux...

Gili a écrit :
Ouinn

Je viens d'avoir la triste confirmation, Laurie Anne m'ignore, ne pas répondre à mon harcèlement par MP je comprend, mais ignorer mes réponses sur le fofo, ça m'attriste réellement.

... c'est peut être à cause de mon orthographe snif

Avant de chouiner, tu as regardé les heures auxquelles avaient été postées les réponses ?

Au moment ou j'ai cliqué "répondre", tu n'avais pas posté ton message, je l'ai vu après l'avoir fait (oui, il m'a fallu 2,5 minutes pour répondre deux lignes, je discutais avec quelqu'un en même temps) et ait eu la flemme de signaler l'éternel "Grilled", parce que l'iTruc n'est pas idéal pour l'édition de messages.

Pour ce qui est de ton problème de MP, vu que tu veux absolument le mettre à jour : je n'ai pas le temps en ce moment de faire des critiques de sites (le boulot, c'est fou, plus les gens sont en congé, plus il y a à faire pour ceux qui restent).

Fin du HS sans intérêt.

Exotiik a écrit :
Mais par contre, lorsque je réduit ma fenêtre, le logo vient se méler a mon texte. Il y a moyen d'éviter ça?

Oui, en ayant un site de taille fixe, dans un conteneur comprenant le contenu et le logo.

Mais effectivement, sans le code de ta page, c'est plus difficile.

Voici le code de ma page comprenant la solution apportée par Gili

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>
       <title>Titre</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	   <link rel="stylesheet" media="screen" type="text/css" title="Design" href="comment.css" />
	   
   </head>
   <body>
   
   <div class="corps">
   <img src='http://i42.servimg.com/u/f42/12/12/79/83/a_prop11.png' /><br /><br />
   <p>Eminuit autem inter humilia supergressa iam impotentia fines mediocrium delictorum nefanda Clematii cuiusdam Alexandrini nobilis mors repentina; cuius socrus cum misceri sibi generum, flagrans eius amore, non impetraret, ut ferebatur, per palatii pseudothyrum introducta, oblato pretioso reginae monili id adsecuta est, ut ad Honoratum tum comitem orientis formula missa letali omnino scelere nullo contactus idem Clematius nec hiscere nec loqui permissus occideretur.

Nisi mihi Phaedrum, inquam, tu mentitum aut Zenonem putas, quorum utrumque audivi, cum mihi nihil sane praeter sedulitatem probarent, omnes mihi Epicuri sententiae satis notae sunt. atque eos, quos nominavi, cum Attico nostro frequenter audivi, cum miraretur ille quidem utrumque, Phaedrum autem etiam amaret, cotidieque inter nos ea, quae audiebamus, conferebamus, neque erat umquam controversia, quid ego intellegerem, sed quid probarem.

At nunc si ad aliquem bene nummatum tumentemque ideo honestus advena salutatum introieris, primitus tamquam exoptatus suscipieris et interrogatus multa coactusque mentiri, miraberis numquam antea visus summatem virum tenuem te sic enixius observantem, ut paeniteat ob haec bona tamquam praecipua non vidisse ante decennium Romam.

Excitavit hic ardor milites per municipia plurima, quae isdem conterminant, dispositos et castella, sed quisque serpentes latius pro viribus repellere moliens, nunc globis confertos, aliquotiens et dispersos multitudine superabatur ingenti, quae nata et educata inter editos recurvosque ambitus montium eos ut loca plana persultat et mollia, missilibus obvios eminus lacessens et ululatu truci perterrens.

</p>
   </div>
   
   
		<!-- Pied -->
		 <a href="Lien"/><p class="footer"><img src='http://i42.servimg.com/u/f42/12/12/79/83/entete10.png'></p></a>
		
   
   </body>
</html>

et mon css :

body
{

background-color: #897F78;

}

.footer
{
text-align: left;
margin:0;
padding:0;

} 


.corps
{
text-align: right;
color: #DDDDDD;
margin: 50px;
font-family: arial;
font-size: 20px;
}