Problème de bordure HTML - CSS
Florizon10
Messages postés
4
Statut
Membre
-
jordane45 Messages postés 30427 Date d'inscription Statut Modérateur Dernière intervention -
jordane45 Messages postés 30427 Date d'inscription Statut Modérateur Dernière intervention -
Bonjour,
Il y a peu, j'ai décidé de suivre des cours de html et css sur openclassroom, et, j'ai eu un problème sur les cours concernant les bordures.
Pour faire simple, ma bordure prends toute la largeur de la page et non une largeur normale, comme un bouton.
Je vous mets mon code ci-joint :
le css
h1 {
font-size: 3.5em;
font-family: 'Caramel', cursive;
text-align: center;
text-decoration: underline;
}
.positif {
color: darkcyan;
}
.serveur {
height: 25em;
width: 40em;
padding-left: 75em;
}
.bouton1 {
border-bottom: 1px solid blue;
border-right: 3px solid rgb(14, 126, 10);
border-top: 1px solid blue;
border-left: 3px solid rgb(14, 126, 10);
}
le html :
<!DOCTYPE HTML>
<html lang="fr">
<head>
<meta charset="utf-8">
<link href="style.css" rel="stylesheet">
<title>ModdedCraft</title>
<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Caramel&display=swap" rel="stylesheet">
</head>
<body>
<h1>Bienvenue sur ModdedCraft !</h1>
<p>Voici une image du serveur.</p>
<img class="serveur" src="https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fattackofthefanboy.com%2Fwp-content%2Fuploads%2F2020%2F07%2FSonicEthers-Unbelievable-Shaders.jpg&f=1&nofb=1&ipt=a269bae52a0e6cf60ecbaf7c33410e72f999b7f7ed92410f96eb5fae488b5311&ipo=images" alt="Photo du serveur minecraft" title="Le serveur avec des shaders">
<p>Ce serveur a de nombreux avantages. En voici quelque uns :</p>
<ul class="positif">
<li>Une communauté francaise</li>
<li>De nombreux giveaways</li>
<li>Des serveurs très puissants</li>
<li>De nombreux mini-jeux</li>
<li>Un excellent anti-cheat<li>
</ul>
<p class="bouton1">Élément</p>
</body>
</html>
Voilà les extraits, en remerciant d'avance la personne qui m'aidera.