site qui ne fonctionne pas sur firefox

18 mai 2021 à 12:32:53

Bonjour, tout est dans le titre, j'ai un site avec un lien qui mène vers une autre page, je vous montre le problème pour que vous compreniez :

la première image c'est sur firefox, la deuxième sur chrome, sur chrome je peux cliquer sur le lien alors que sur firefox ça descend la boite et ça ne mène nul part, je ne sais pas si il y a besoin du code mais je le donne au cas ou ( c'est du css et du html dans du php ) :

$q = $db -> query('SELECT * FROM events ');
    while ($nice = $q -> fetch()) 
    {
        echo '<div id=event>';
        echo '<div id=div2>';

        ?><a href="pagevent.php?Titre=<?php echo $nice['Titre']; ?>" style="font-size:120%; background-color:white; border:none; text-align:center; color:black" > <?php echo '<p id=titre> Titre:'.$nice['Titre']." <p>  "; ?> </a> <?php
        echo 'Lieu:'.$nice['Lieu']."<br/>";
        echo 'Date de début:'.$nice['datedebut']."<br/>";
        echo 'Date de fin:'.$nice['datefin']."<br/>";
        echo 'Jeux:'.$nice['Jeux']."<br/>";
        echo 'Description:'.$nice['Descriptio']."<br/>";
        echo 'Prix:'.$nice['prix']."<br/>";
        echo 'Nombre de participants:'. $nice['nbr_participants']."<br/><br/><br/><br/>"; 

        if($role == 'Admin')
        {
            ?> 
            <a href="includes/supprimevent.php?Titre=<?php echo $nice['Titre']; ?>" style="font-size: 28px; border:none;"> Supprimer évènement <br/> </a>
            <?php
        }
        else
        {

        }
    echo '</div>';
    echo '</div>';
    }

et le css :

#event{
    display: inline-block;
    margin: 6%;
    width: 20%;
    height: 64%;
    border: grey 3px solid;
    text-align: end;
    background-image: url("img/lanimage.jpg");
    background-repeat: no-repeat;
    background-size: contain;
    background-color: rgb(240, 218, 233);
}

#div2{
    display: inline-table;
    margin-top: 75%;
    color: black;
    margin-right: 10%;
}

body 
{
    background-image: url("img/event.jpg");
    margin-left: 0;
    margin-top: 8%;
    color:white;
}

#titre{
    font-size:200%;
    color: rgb(58, 13, 58);
}

Voilà j'aimerais savoir comment régler ce problème, merci d'avance

-
Edité par MassdeyYy 18 mai 2021 à 12:33:36

Domi65

18 mai 2021 à 12:44:12

Et si tu nous mettais du code HTML et non du PHP, vu que tu es sur le forum HTML/CSS ?

C'est pas compliqué, tu fais CTRL + U, et tu copies le code.

On pourra te répondre, comme ça.

AbcAbc6

18 mai 2021 à 12:49:01

Bonjour, un identifiant est unique dans le document, tu ne peux avoir plusieurs id="event" ou id="div2" . Comme tu boucles sur ton HTML tu as plusieurs id de même nom. Passe ton HTML au validateur pour voir et corriger tes erreurs => https://validator.w3.org/

<p id="titre"> Si c'est une titre utilise les balises de titres <h1> à <h6> en fonction (et en respectant) la hiérarchie de titre.

Pour ton problème d'affichage on ne donne pas de hauteur à un élément dont le contenu est/peut être variable. Utilise min-height si tu veux une hauteur minimum.

MassdeyYy

18 mai 2021 à 14:05:29

Domi65 a écrit:

Et si tu nous mettais du code HTML et non du PHP, vu que tu es sur le forum HTML/CSS ?

C'est pas compliqué, tu fais CTRL + U, et tu copies le code.

On pourra te répondre, comme ça.

Merci pour cette aimable recommandation, je ne connaissais pas cette fonctionnalité, voici le code HTML :

<head>
<link rel="stylesheet" href="cssnavi.css" />
<link rel="stylesheet" href="../cssnavi.css" />
</head>

<header class="navigation">
    <ul>
        <li>
         <a href="projet.php">Accueil</a>  
        </li>
        <li>  
         <a href ="evenements.php">Evenements</a>
        </li>
        <li>
         <a href="boutique.php">Boutique</a>
        </li>
        <li>
         <a href="inscrireouconnecter.php">Connexion</a>
        </li>
        <li>
        <button id="openBtn"> Contact </button>
        <dialog id="contact">
         <button id="closeBtn"> Fermer </button>
         <p class="centre"> <h4> Contact : infos de contact <br> </p>
         </dialog>
        </li>

</header>

        <form method="GET">
            <input type="search" name="recherche" placeholder="Rechercher par titre, lieu, catégorie ou description"/>
            <input type="submit" value="Rechercher"/>
        </form>
        
        
                    <ul>
                            <li>  <br/>  </li>
                        </ul>
        
    </ul>
<link rel="stylesheet" href="event.css" />
<script src="javascript.js" defer></script>
<br/>

<br/> <br/><a href="javascript:popupBasique('popup.php')" class=nospace>Création d'évenement</a><br/><div id=event><div id=div2><a href="pagevent.php?Titre=testttt" style="font-size:120%; background-color:white; border:none; text-align:center; color:black" > <p id=titre> Titre:testttt <p>   </a> Lieu:testttt<br/>Date de début:2021-05-28<br/>Date de fin:2021-06-02<br/>Jeux:etestzate<br/>Description:tetst<br/>Prix:tetDT<br/>Nombre de participants:0<br/><br/><br/><br/> 
            <a href="includes/supprimevent.php?Titre=testttt" style="font-size: 28px; border:none;"> Supprimer évènement <br/> </a>
            </div></div>

et event.css qui est link c'est le css que j'ai envoyé au dessus

Domi65

18 mai 2021 à 19:15:34

Le validateur HTML indique toute une palanquée d'erreurs. On ne peut que t'inviter à y déposer ton code.