Fixer un footer en bas de page
Positionner votre footer dans une <div> et créer les propriétés CSS suivantes :
footer {
Position : fixed;
Bottom : 0;
}
div {
display: flex;
justify-content: center;
}
Créer une fenêtre modal sans Javascript (merci à believemy.com)
CSS :
.modal_margin {
margin-top: 5px;
}
.modal {
visibility: hidden;
opacity: 0;
position: absolute;
top: 0; right: 0;
bottom: 0; left: 0;
display: flex;
justify-content: center;
background: rgba(77, 77, 77, .7);
transition: all .4s;
}
.modal:target {
visibility: visible;
opacity: 1;
}
.modal_content {
border-radius: 4px;
top: 20px;
position: relative;
max-height: 50px;
width: 200px;
max-width: 90%;
background: whitesmoke;
padding: 1.5em 1.5em;
font-size: 12px;
}
.modal_close {
position: absolute;
top: 25px;
right: 145px;
color: grey;
text-decoration: none;
}
.link_comment {
font-size: 11px;
color: rgb(58, 61, 63);
font-style: italic;
}
Code :
<div class=”modal_margin”>
<a href=”#<?php echo $match_name[‘match_name’]; ?>” class=”link_comment”>Commentaires match</a>
<div id=”<?php echo $match_name[‘match_name’]; ?>” class=”modal”>
<div class=”modal_content”><?php echo $match_name[‘match_comment’]; ?</div>
<a href=”#” class=”modal_close”>x</a>
</div>
</div>