Bonjour,

Je cherche à centrer un text par rapport à une div (comme je l'ai fait dans le premier encadré de l'image). Seulement, pour le second encadré, du fait que ce soit un <a> et non un <h5> comme le premier, l'alignement ne peux se faire.

Image : 

Code HTML :

<div class="row">
							
							<div class="col-xl-12">
								<div class="card bg-dark text-white">
									<img src="card.png" class="card-img" alt="...">
									<div class="card-img-overlay">
										<h5 class="display-4 card-title">Réserver un cours</h5>
									
				
									</div>
								</div>
							</div>
							<div class="col-xl-12">
								<div class="card bg-dark text-white">
									<img src="card.png" class="card-img" alt="...">
									<div class="card-img-overlay">
									
									<a style="text-decoration:none" href="http://google.fr" class="display-4 card-title">mes devoirs</a>
									</div>
								</div>
							</div>

						</div>

Code CSS: 

.container {
    width: 1170px;

  }

  .header {
	background: url(back_lap.png);
	height: 110vh;
	background-size: cover;

	}

 .logo {
		width: 450px;
		padding-top: 10%;
		position: relative;	
		margin-left: 60%;
	}

	.card {
			position: relative;
			width:300px;
			height:auto;
			margin-top: 25px;
			margin-left: 57.5%;
			top: 20vh;
		}

  .main-title {
	text-transform: uppercase;
	margin-top: 20px;
	font-weight: 100;
	font-size: 30px;
	width: 450px;
	position: relative;
	text-align: center;
	letter-spacing: .4rem;
	margin-left: 60%;

	}
	

	.card-title{
		text-transform: uppercase;
		margin-top: 2px;
		font-weight: 150;
		font-size: 20px;
		text-align: center;
		letter-spacing: .1rem;
	}

Merci

-
Edité par nezridan 18 juin 2019 à 16:20:30

Même dans un a le text-align: center doit fonctionner

ArthurChaigne2 a écrit:

Même dans un a le text-align: center doit fonctionner

Alors je ne comprends pas pourquoi ça ne fonctionne pas. Les deux ont la même classe (card-title) et donc le meme CSS.

Salut, 

essaye de mettre le text-align dans le css .card

Cordialement

Ça fonctionne ! 

Merci

ArthurChaigne2 a écrit:

Même dans un a le text-align: center doit fonctionner

Non, à moins que le <a> en question ait une propriété display appliquée qui change son comportement de phrasing content par défaut. Comme pour tout élément de phrasing, en fait.