28172 sujets

CSS et mise en forme, CSS3

Positionnement à partir du centre

Bonsoir,

J'ai 2 volets. Le second chevauche le premier sur 60px. J'ai un conteneur en relative et ces 2 volets sont en absolute. Je les positionne avec left et right. Mais ce que j'aurais voulu c'est pouvoir les positionner à partir du centre afin de toujours conserver ces 60 px au moins jusqu'à une résolution moyenne. Or comme je les positionne à partir de mon conteneur qui a une largeur globale, ils se déplacent avec le redimensionnement de l'écran.

Ya t-il un moyen de les positionner à partir du centre de mon conteneur ou bien ai-je mal pensé le machin ?

http://img4.hostingpics.net/pics/336608volets.png
Modérateur
Bonjour,

Par exemple ça ?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"> 
<style>
.container {position:relative;height:100px;}
.a, .b {position:absolute;}
.a {background:#e95b4c;left:0;right:50%;margin-right:-30px;height:100px;}
.b {background:#1c1d1e;right:0;left:50%;margin-left:-30px;top:10px;height:80px;}
</style>
</head>
<body>
<h1>Test</h1>
<div class="container">
<div class="a">
</div>
<div class="b">
</div>
</div>
</body>
</html>
Amicalement,
Modifié par parsimonhi (02 Mar 2016 - 22:54)
Mouai... ok : faut vraiment que je prenne un week-end si j'en arrive à bloquer sur quelque-chose comme ça...
Merci Parsi ^^
En fait... j'ai oublié de préciser que mes deux éléments (une image et une div comprenant 2 titres et 2 paragraphes) ont une largeur fixe... ce qui change la donne.
Modérateur
Bonjour,

S'ils ont une largeur fixe, il suffit probablement de retirer les left:0 et right:0, non?

Tes contraintes sont cependant trop vagues. Que veux-tu obtenir quand la fenêtre est trop étroite pour contenir tes deux éléments avec une superposition de 60px par exemple ?

Amicalement,
Ta réponse est parfaite, et tu as tout à fait raison sur mon explication assez légère. On va dire que comme je bosse depuis 1 semaine avec des côtes fêlées ça met à mal mes ptits neurones hein, on va être sympa avé mon ego ;p

Merci de ta patience en tout cas.

P.S. quand la fenêtre sera trop étroite, je repasserai tout dans le flux.
Sujet clos
Aller à