diff --git a/Find_the_number/style.css b/Find_the_number/style.css new file mode 100644 index 0000000..0fa8221 --- /dev/null +++ b/Find_the_number/style.css @@ -0,0 +1,72 @@ +#container-content { + padding: 20px; + background-color: #fff; + border-radius: 5px; + box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); + width: 25%; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; /* Centrer verticalement */ +} + +#hist-container { + padding: 20px; + width: 25%; + background-color: #fff; + border-radius: 5px; + box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); + text-align: center; + position: absolute; + right: 10px; + top: 15%; /* Placez-le à droite de la page par défaut */ +} + +@media screen and (max-width: 850px) { + #container-content, #hist-container { + width: 100%; + position: static; + margin-top: 20px; /* Ajoutez un espacement en haut pour séparer le contenu */ + } + + #hist-container { + top: auto; + bottom: 20px; /* Placez-le en bas du #container-content sur les téléphones */ + } +} + +ul { + list-style-type: none; + list-style-position: inside; + padding-left: 0; /* Ajustez la valeur pour éliminer tout espacement entre le texte et la puce */ +} + +#feedback-container { + width: 100%; + text-align: center; + padding: 10px; + margin-top: 20px; /* Ajouter de l'espace au-dessus du feedback */ +} + +#result { + font-size: 24px; + font-weight: bold; + margin-bottom: -10px; +} + +.correct { + background-color: green; + color: white; +} + +.incorrect { + background-color: red; + color: white; +} + +.correct, .incorrect { + padding: 10px; + border-radius: 10px; + width: 95%; + margin-top: -20px; +} \ No newline at end of file