taille variable et rapport carré d'un div

**René N013** · 30/06/2010, 17h49

Salut,

j'ai un souci. C'est inévitable où je n'ouvrirais pas cette discussion. Je m'excuse si la solution se trouve sur le forum. J'ai cherché : je n'ai pas trouvé.

J'ai un <div id:"central"> dans lequel se place une image variable, toujours carrée. Pour le moment j'ai ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
#central {height:76%; top:12%; position:absolute; text-align:center;}
#central img {height:100%; top:0px; left:0px;}

Le Problème c'est que je ne parviens pas à faire en sorte que width soit égal à height pour ne pas déformer l'image et que la taille du div central reste variable et proportionnel à l'écran de l'utilisateur.

Je vous remercie de toute l'aide que vous pourrez m'apporter.

**devyan** · 30/06/2010, 19h18

Bonjour,

Avec les informations données tout fonctionne correctement...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
	<meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type">
    <title>Test</title>
	<style type="text/css">
		#central {height:76%; top:12%; position:absolute; text-align:center;}
#central img {height:100%; top:0px; left:0px;}
	</style>
	</head>
<body>
<div id="central"><img alt="logo" src="http://www.developpez.net/template/images/logo.gif"></div>
</body></html>

devyan

**René N013** · 30/06/2010, 20h06

Merci Devyan pour ta réponse et ton exemple.

La question de l'imbrication jouait dans mon cas.
Ton exemple m'a fait me rendre compte des quelques erreurs que j'avais commises.

Merci beaucoup.

La prochaine fois je ferai de ces fichiers test tout simple mais qui aident la comparaison.