JSFiddle - React, Tailwind, and code Playground

by TEP81

HTML

<div class="regle">
<p>Un nombre b est <strong>multiple</strong> du nombre a si l’on peut trouver b en multipliant a par un nombre entier c.</p>
</div>
<div class="exple">
<p>48 est un multiple de 16 parce que <span class="math inline">\(16\times 3=48\)</span></p>
</div>
<p><img src="./images/danger.png" style="width:3.0%" /> Il faut que ce nombre c soit <strong>entier</strong></p>
<h3 id="diviseur">Diviseur</h3>
<div class="regle">
<p>Un nombre b est un <strong>diviseur</strong> du nombre a si le résultat de a/b est un nombre entier ; autrement dit le <em>reste</em> de la division a/b est égal à 0</p>
</div>
<div class="exple">
<p>8 est un diviseur de 168 parce que =21, qui est un nombre entier</p>
</div>
<h3 id="nombre-premier">Nombre premier</h3>
<div class="regle">
<p>Si un nombre a n’est divisible par aucun nombre sauf par lui-même et par 1 on dit qu’il est <strong>premier</strong></p>
</div>
<div class="exple">
<p>11 est un nombre premier ; 12 ne l'est pas car il a pour diviseurs 2,3,4 et 6</p>
</div>
<h3 id="nombres-premiers-entre-eux">Nombres premiers entre eux</h3>
<div class="regle">
<p>Si un nombre b <em>ne divise pas</em> un nombre a on dit que a et b sont <strong>premiers entre eux</strong></p>
</div>
<div class="exple">
<p>18 et 7 sont premiers entre eux car le reste de la division 18/7 n'est pas égal à 0</p>
</div>

CSS

.regle {
	width: 50%;
	display: inline-block;
	/*float: left;*/
	/*padding: 5px 10px;*/
	box-shadow: black 0.5em 0.5em 0.3em;
	border: solid thin red;
	background: #F3C0CB;
	border-radius: 1em;
	-moz-border-radius: 1em ;
	-webkit-border-radius: 1em;
	margin-bottom: 1em;
}




.exple {
	display: inline-block;
	/*margin-top: 5px;*/
	/*margin-left: 55%;*/
	/*float:right;*/
	width:45%;
	height: auto;
	padding: 10 px;
	box-shadow: black 0.3em 0.3em 0.3em;
	background: #F6FF8C;
	border: 1px solid #bbbbbb;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	
}