Skip to content

Instantly share code, notes, and snippets.

@CoraDel

CoraDel/Wanted html

Last active February 24, 2018 14:18
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save CoraDel/b41d62e9b1fdcf512c909548c2c5fb60 to your computer and use it in GitHub Desktop.
Save CoraDel/b41d62e9b1fdcf512c909548c2c5fb60 to your computer and use it in GitHub Desktop.
Download ZIP
Quête WCS
Raw
style.css
body {
font-family: sans-serif;
}
#block_1 {
width: 70px;
height: 300px;
position: relative;
background-color: white;
opacity: 0.5;
}
.texte1 {
width: 590%;
height: 33%;
margin-left: 65%;
margin-right: auto;
padding: 3px;
top: 50px;
background-color: white;
position: absolute;
font-size: 2.5em;
text-align: center;
font-color: black;
border-radius: 10px;
opacity: 0.9;
}
.texte1 span {
color: orange;
}
.texte2 {
margin-left: 120px;
top: 250px;
position: absolute;
color: white;
font-size: 4em;
}
#block_1:hover {
opacity: 1;
}
#block_1:hover .texte1 {
visibility: hidden;
}
#block_1:hover .texte2 {
top: 450px;
margin-right: auto;
margin-left: 180px;
position: absolute;
color: white;
font-size: 2.1em;
}
Raw
Wanted html
<!DOCTYPE html>
<html>
<head>
<title> Gandalf </title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div id="block_1">
<img src= "http://images.innoveduc.fr/integration_gandalf.png" />
<div class="texte1"> reward <span>1000</span> <br> golden coins </div>
<p class="texte2"> Gandalf </p>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment