Vérifiez vos informations

Il semblerait que les informations techniques de votre profil n'aient pas été actualisées depuis un certain temps... Pour que l'aide apportée vous soit efficace, il est important que ces informations soient à jour : prenez quelques secondes pour confirmer ou compléter les informations suivantes.


Lien de votre forum
Version de ce forum
Vous êtes le fondateur de ce forum
Vous avez modifié le CSS de ce forum
Vous avez modifié les templates de ce forum
Votre navigateur

Page d'accueil : incapable de centrer une div fixée sur le bas de la page

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Page d'accueil : incapable de centrer une div fixée sur le bas de la page

Message par BoogyLou le Sam 11 Aoû 2018 - 22:23

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Opera
Capture d'écran du problème :
Voir l'image:
Page d'accueil : incapable de centrer une div fixée sur le bas de la page 1534018181-capture-d-ecran-2018-08-11-a-16-09-19

Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : 11/08/18
Lien du forum : http://buzzkillmuch.forumactif.com/h1-accueil

Description du problème

Bonjour!

Ça fait longtemps que je n'ai pas codé et j'ai décidé de démarrer une page d'accueil. À date, ma page va comme suit :

Code:
<style type="text/css">

body{
background-color: black;
margin: 0px;
padding : 0px;
}

.add{
color:#f8f7e9;
opacity:0.1;
}

.mandala{
background-image: url('https://image.noelshack.com/fichiers/2018/32/6/1534015960-alice-ttest.png');
width:500px;
height:300px;
position: absolute;
margin: 0px auto;
bottom: 0px;
}

.petal{
opacity:0;
 transition:All 1s ease;
-webkit-transition:All 1s ease;
-moz-transition:All 1s ease;
-o-transition:All 1s ease!important
}

.petal:hover{
opacity:1;
 transition:All 1s ease;
-webkit-transition:All 1s ease;
-moz-transition:All 1s ease;
-o-transition:All 1s ease!important
}

a {
color: inherit
}
<!--
A{text-decoration:none
}
-->

</style>  
<center>
 <div class="mandala">
 </div><a target="_blank" href="http://www.forumactif.com" class="add">forumactif.com</a>
</center>

(le id «petal» est pour plus tard on ne fait pas attention)

J'aimerais centrer mon div et, à la fois, le garder fixé au bas de la fenêtre. Ensuite, les menus vont apparaître avec survole sur les pétales.

Est-ce que quelqu'un pourrait m'expliquer ce que je fais de pas correct s'il vous plaît?

Merci! Smile
BoogyLou

BoogyLou
*

Messages : 31
Inscrit(e) le : 11/06/2013

http://dark-circus.forum-canada.com/
BoogyLou a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueil : incapable de centrer une div fixée sur le bas de la page

Message par MlleAlys le Dim 12 Aoû 2018 - 0:17

Bonjour,
Les marges auto ne fonctionnent pas en position absolue ou fixe. Vous pouvez cependant utiliser l'astuce suivante pour un élément qui a une largeur fixe : le décaler de 50% de la largeur de l'écran, mais comme c'est le début de l'élément qui se retrouve au milieu, utiliser une marge dans l'autre sens de la moitié de la largeur de l'élément. Ce qui donne pour .mandala :
Code:
.mandala {
  background-image: url(https://image.noelshack.com/fichiers/2018/32/6/1534015960-alice-ttest.png);
  width: 500px;
  height: 300px;
  position: absolute;
  bottom: 0px;
  left: 50%;
  margin-left :-250px;
}
MlleAlys

MlleAlys
Membre actif

Messages : 4757
Inscrit(e) le : 12/09/2012

http://mllealys2.forumactif.org/
MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueil : incapable de centrer une div fixée sur le bas de la page

Message par BoogyLou le Dim 12 Aoû 2018 - 1:09

oh wow ça marche! merci Smile ce sujet peut être archivé!!
BoogyLou

BoogyLou
*

Messages : 31
Inscrit(e) le : 11/06/2013

http://dark-circus.forum-canada.com/
BoogyLou a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum