28172 sujets
CSS et mise en forme, CSS3
Bonjour Yordi,
Je ne comprend pas car quand je fais le test sous chrome sur la page https://codepen.io/pen/
cela fonctionne.
Mais pas sous IE11. et je ne peux ni utiliser chrome, ni edge, ni firefox.
Merci
Je ne comprend pas car quand je fais le test sous chrome sur la page https://codepen.io/pen/
cela fonctionne.
Mais pas sous IE11. et je ne peux ni utiliser chrome, ni edge, ni firefox.
/* CSS POST-IT*/
body {
position: relative;
margin-left: auto;
margin-right: auto;
height: 300px;
width: 400px;
/*background:#F1C387;*/
font-family: 'Roboto Slab', serif;
}
#header {
padding-top:20px;
height:50px;
width:500px;
display:block;
background:#0E0300;
color:#FFFFFF;
font-size:170%;
text-align:center;
}
/*---------------- CODE content sous ie 11 -----------------*/
/*.content:before{
color: #ff0000;
font-size: 80%;
vertical-align: top;
content:"POUR";
color:#FFFFFF;
}*/
.content:after{
color: #ff0000;
font-size: 100%;
vertical-align: top;
content:"MEMOIRE";
color:#FFFFFF;
}
/*---------------- END CODE content sous ie 11 -----------------*/
#corps {
position:relative;
height:100%;
width:500px;
background:#F1C387;
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<link href="../../css/cssPostit.css" rel="stylesheet" type="text/css" />
<title>POUR MEMOIRE</title>
</head>
<body>
<div id="header" class="content">
</div>
<div id="corps">
<p>
</p>
<p>
</p>
<p>
</p>
</div>
</body>
Merci
Hello,
je pense que c'est plutôt lié au fait que tu as oublié d'ajouter un content à ton pseudo élément:
je pense que c'est plutôt lié au fait que tu as oublié d'ajouter un content à ton pseudo élément:
.content:after{
content: ""; /* ? Ce content est indispensable pour générer le pseudo élément. Il doit être soit vide, un string, url(""), attr(), counter() ect*/
color: #ff0000;
font-size: 100%;
vertical-align: top;
content:"MEMOIRE";
color:#FFFFFF;
}Aussi, tu peux utiliser le "nouveau" doctype HTML5 qui sera plus cohérent :
Modifié par Felipe (12 Mar 2020 - 11:32)
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="">
</head>
<body>
</body>
</html>Modifié par Felipe (12 Mar 2020 - 11:32)
Je me suis permis d'éditer le code HTML du gabarit : l'attribut lang (la langue par défaut du document) se place sur l'élément html, pas la fin du doctype 
