Bonjour,

pour le design de mon application WEB , j'utilise CSS. j'organise tout les objet par id ( #id_objet) ça marche avec des objets et ça ne marche pas avec d'autres. avez vous une explication?? Par exemple je veux changer la position et la couleur du bouton qui a comme id=quit, voicu le code CSS

#quit
{
	background-color: rgba(0, 162, 255,0);
	font-size : 15px;
	position: absolute;
	top : 10%;
	left:95%;
	width:100px;
	height: 30px;
}

mais rien n'a changé, le bouton est toujours en haut à gauche avec le design de base. pouvez vous m'aider?

Bonjour,

déjà, évite les id dans le CSS. Ça marche, hein, c'est juste sortir le bazooka, et poser d'éventuels futurs problèmes de spécificité des sélecteurs.

Ensuite, évite le position: absolute (surtout avec un left à 95%).

Enfin, évite de fixer des hauteurs à tes éléments, lâche du lest

Et pour finir : sans ton HTML, on ne peut pas te dire pour sûr ce qui cloche. Servir du CSS sans HTML c'est comme servir une soupe sans bol : ça sent bon, ça a une jolie couleur, mais comment on va pouvoir manger ça ?

id="quit", plutôt ? Avec des guillemets ou apostrophes.

voici le code html

</form>
<form method="post" action='login.php'>
<div class="quit">
		<input type="submit" name="quit" id="quit" value="Quitter"/>
</div>
</form>

Dans ce cas, c'est soit la classe que tu personnalises en CSS avec le bouton, soit tu ne mets pas de div. La position du bouton dépend de ta div.

voila les modifications que j'ai fait :

HTML

</form>
<form method="post" action='login.php'>
<input class="quit" type="submit" name="quit" id="quitter" value="Quitter"/>
</form>

CSS:

.quit
{
	background-color: rgba(0, 162, 255,0);
	font-size : 15px;
	position: absolute;
	top : 10%;
	left:95%;
	width:100px;

}

rien n'a changé

Salut,

Enregistré dans un fiddle ici : https://jsfiddle.net/mot8gfnz/ et ça fonctionne.

Tu as une balise fermante form en trop dans le html que tu nous as donné sinon.

Juste pour info, la couleur résultante du rgba est transparente (alpha à 0).

@MrChampy

c'est exactement ce que je veux avoir, mais dans ma page , le bouton est toujours à gauche en haut !!

est ce que je dois redémarrer mon serveur web local pour avoir les changement??

@Lamecarlate

oui je sais , je veux que le bouton soit transparente

-
Edité par Brainiac91 14 décembre 2017 à 14:22:54

Et mes remarques sur l'absolu et la hauteur sont toujours valides.

je suis nouveau dans CSS , donc j'utilise la position absolu car c'est la plus simple, comment utiliser la position relative?? par rapport a quel objet?

N'utilise ni l'un ni l'autre. Ça n'est pas "le plus simple", vraiment. C'est comme si tu disais : "je suis nouveau dans le bâtiment, alors j'utilise un marteau-piqueur pour faire des trous dans les murs, c'est le plus simple". Ah bah oui ça fait des trous mais c'est pas le plus adapter, en plus d'être super difficile à maîtriser. Position absolute c'est comme ça : attirant, "intuitif" (avec des gros guillemets) mais compliqué et avec des effets de bords dévastateurs.

Si tu veux mettre un élément tout à droite, pense flexbox. Lis le cours : https://openclassrooms.com/courses/apprenez-a-creer-votre-site-web-avec-html5-et-css3?status=published et cherche sur les forums, il y avait un sujet dessus hier ou avant-hier.

-
Edité par Lamecarlate 14 décembre 2017 à 14:37:34

Remarque:

j'ai essayé mon code HTML et CSS dans le site https://jsfiddle.net et il marche à merveille