Placer une image en bas d'un div plus haut que l'écran

Mammouth du PHP | 2937 Messages

27 oct. 2006, 14:56

Salut!

Pour que la colonne blanche prenne toute la hauteur, voici le CSS modifié:

Code : Tout sélectionner

body { color: black; background: blue; padding: 0; margin: 0; } #conteneur { width: 600px; margin: 0; position: absolute; } #colonne-jaune { color: black; background: yellow; padding: 0 0 0 200px; position: absolute; } #colonne-blanche { color: black; background: white; width: 200px; float: left; position: absolute; top: 0; bottom: 0; left: 0; } #image-verte { color: black; background: green; width: 100px; height: 50px; padding: 0; margin: 0; position: absolute; bottom: 0; }
Essayé avec succès avec les mêmes navigateurs, sauf IE 6.

Eléphanteau du PHP | 15 Messages

30 oct. 2006, 10:55

J'ai presque plus rien a dire
je pense que c'est ce que Albat souhaitait obtenir d'un point de vue visuel

Par contre, j'aurais juste une objection a formuler sur le principe. Je m'explique, je pense que la colonne blanche correspond a un menu et le bloc jaune au contenu donc, je m'interroge sur la logique de devoir mettre le div du menu dans le div du contenu, il me semble que le code perd de sa coherence mais si c'est la seule solution pour avoir quelque chose d'accessible, peut etre est il preferable de perdre un peu de coherence.

Donc merci Victor BRITO pour cette solution

Administrateur PHPfrance
Administrateur PHPfrance | 11457 Messages

30 oct. 2006, 19:03

Pardon de ne pas avoir répondu plus tôt. :agenouille:

Tout d'abord, je tiens à vous remercier pour vos contributions et conseils que je suis en train d'étudier. :merci: :ordi:

J'en profite pour apporter une petite précision :
falgan a soupçonné que cette colonne blanche pouvait contenir le menu.
Dans ce cas, il y aurait en effet un petit souci de cohérence dans la construction des pages.
Je tiens à le rassurer : la colonne blanche ne contient pas le menu.
Mais son intervention (et sa mise en garde) était tout à fait opportune ! =D>

La structure de ce site prévoit un menu horizontal placé au-dessus des blocs blanc et jaune.
La colonne blanche étant utilisée pour afficher des infos ponctuelles, des liens, etc.

Administrateur PHPfrance
Administrateur PHPfrance | 11457 Messages

02 nov. 2006, 00:29

Navré de venir jouer les désespérants, Victor,
mais si le résultat obtenu est parfait sous Firefox,
Internet Explorer 6 n'en fait qu'à sa tête
et affiche le vert en bas du blanc, non de la page.

Je vais chercher en utilisant ton code comme base...

Mammouth du PHP | 2937 Messages

02 nov. 2006, 11:02

Salut!
Navré de venir jouer les désespérants, Victor,
mais si le résultat obtenu est parfait sous Firefox,
Internet Explorer 6 n'en fait qu'à sa tête
et affiche le vert en bas du blanc, non de la page.

Je vais chercher en utilisant ton code comme base...
Essayé avec succès avec les mêmes navigateurs, sauf IE 6.
Il fallait suivre, Albat. :wink:

Administrateur PHPfrance
Administrateur PHPfrance | 11457 Messages

02 nov. 2006, 11:20

En lisant ça :
Essayé avec succès avec les mêmes navigateurs, sauf IE 6.
j'avais compris ça :
Essayé (...) sauf IE 6.
alors qu'en fait, tu voulais dire ça :
avec succès (...) sauf IE 6.
8-[

Mammouth du PHP | 514 Messages

02 nov. 2006, 13:53

dans ta classe, pourquoi tu la mets pas en image de fond :

#colGauche {
background: transparent url(../images/image.png) no-repeat bottom left;
}

ou qque chose du genre ?
Ne jamais repousser à demain ce qu'on peut faire après demain ...

Administrateur PHPfrance
Administrateur PHPfrance | 11457 Messages

02 nov. 2006, 13:57

la colonne jaune a déjà une image de fond répétée
à laquelle je veux superposer une image, non répétée, tout en bas.

Mammouth du PHP | 514 Messages

02 nov. 2006, 14:10

peut être en faisant ainsi alors :

<p style="position: absolute; margin-bottom: 0px;" ><img src="monimage.png" alt="tralala" /></p>

?
Ne jamais repousser à demain ce qu'on peut faire après demain ...

Administrateur PHPfrance
Administrateur PHPfrance | 11457 Messages

03 nov. 2006, 17:32

IE 6 :tir2:

Mammouth du PHP | 2937 Messages

03 nov. 2006, 17:34

IE 6 :tir2:
Get IE 7, my dear :wink:

Administrateur PHPfrance
Administrateur PHPfrance | 11457 Messages

03 nov. 2006, 17:39

Le problème n'est pas tant pour moi (qui utilise Firefox 2.0 ou Opera 9)
que pour 85% des internautes qui conserveront IE 6 de longs mois encore...

Mammouth du PHP | 2937 Messages

03 nov. 2006, 17:46

Le problème n'est pas tant pour moi (qui utilise Firefox 2.0 ou Opera 9)
que pour 85% des internautes qui conserveront IE 6 de longs mois encore...
Justement, place un lien sous forme d'image disant "Get IE 7", de même que certains en placent qui dit "Get Firefox". :langue:

Administrateur PHPfrance
Administrateur PHPfrance | 11457 Messages

04 nov. 2006, 22:06

Hip hip hip... :D

J'ai trouvé ! :ordi:
Moi-même, tout seul, comme un grand ! \:D/

Il suffisait de placer l'image dans le bas de page avec un top:-200px :pouce:

L'explication sur le forum d'Alsacréations. :merci: