Welcome to the RuneGlory Wiki, where we do our best to make your life easier!

You can use the search menu on the right side of the wiki (or at the bottom if you are on mobile) to search for the page you are looking for. The most popular pages can be found on the right side of the wiki aswell (or again at the bottom if you are on mobile).

Difference between revisions of "Main page/Test Cypher2"

From RuneGlory
Jump to: navigation, search
 
(5 intermediate revisions by the same user not shown)
Line 1: Line 1:
 +
Testing images <br>
  
 
<html>
 
<html>
<head>
 
 
<style>
 
<style>
div.gallery {
 
    border: 1px solid #000000;
 
}
 
 
div.gallery:hover {
 
    border: 1px solid #7CFC00;
 
}
 
 
div.gallery img {
 
    width: 100%;
 
    height: auto;
 
}
 
  
div.desc {
+
.tooltip .tooltiptext {
     padding: 15px;
+
     visibility: hidden;
 +
    width: 120px;
 +
    background-color: black;
 +
    color: #fff;
 
     text-align: center;
 
     text-align: center;
}
+
    border-radius: 6px;
 +
    padding: 5px 0;
  
* {
+
    /* Position the tooltip */
     box-sizing: border-box;
+
    position: absolute;
 +
     z-index: 1;
 
}
 
}
  
.responsive {
+
.tooltip:hover .tooltiptext {
    padding: 0 6px;
+
     visibility: visible;
    float: left;
 
    width: 24.99999%;
 
}
 
 
 
@media only screen and (max-width: 700px){
 
     .responsive {
 
        width: 49.99999%;
 
        margin: 6px 0;
 
    }
 
}
 
 
 
@media only screen and (max-width: 500px){
 
    .responsive {
 
        width: 100%;
 
    }
 
 
}
 
}
 +
</style>
  
.clearfix:after {
 
    content: "";
 
    display: table;
 
    clear: both;
 
}
 
</style>
 
</head>
 
 
<body>
 
<body>
  
<p> Welcome to the Etherum Wiki. </p>
+
<div class="tooltip">
 
+
<a href="https://wiki.etherumps.com/Main_page/Guides/Skill_guides/Runecrafting">
<div class="responsive">
+
  <img src="https://i.imgur.com/Ezmb51W.png" alt="my picture" height="32" width="32" />
  <div class="gallery">
+
   </a>
    <a target="_blank" href="https://wiki.etherumps.com/Main_page/Guides/General_guides">
+
<span class="tooltiptext">Giant pouch</span>
      <img src="https://i.imgur.com/Nb3kn8d.png" alt="General Guides" width="300" height="200">
 
    </a>
 
    <div class="desc">General Guides</div>
 
    <p>
 
    <div style="padding:6px;"> - Guide 1 </div>
 
    <div style="padding:6px;"> - Guide 2 </div>
 
</p>
 
   </div>
 
</div>
 
 
 
 
 
<div class="responsive">
 
  <div class="gallery">
 
    <a target="_blank" href="https://wiki.etherumps.com/Main_page/Guides/Bestiary">
 
      <img src="https://i.imgur.com/VxEHSw9.png" alt="Bestiary" width="600" height="400">
 
    </a>
 
    <div class="desc">Bestiary</div>
 
    <p>
 
    <div style="padding:6px;"> - Monsters </div>
 
    <div style="padding:6px;"> - Bosses </div>
 
</p>
 
  </div>
 
 
</div>
 
</div>
  
<div class="responsive">
 
  <div class="gallery">
 
    <a target="_blank" href="https://wiki.etherumps.com/Main_page/Guides/Forum_guides">
 
      <img src="https://i.imgur.com/PszyrB4.png" alt="Forum guides" width="600" height="400">
 
    </a>
 
    <div class="desc">More guidezzz</div>
 
  </div>
 
</div>
 
 
<div class="responsive">
 
  <div class="gallery">
 
    <a target="_blank" href="https://wiki.etherumps.com/Main_page/Guides/Support_guides">
 
      <img src="https://imgur.com/gq2HxCg.png" alt="Support Guides " width="600" height="400">
 
    </a>
 
    <div style="padding:6px;"> Text </div>
 
    <div style="padding:6px;"> Text </div>
 
  </div>
 
</div>
 
 
<div class="clearfix"></div>
 
 
</body>
 
</body>
 
</html>
 
</html>
 
 
Icons go to the main overview pages<br>
 
text under it goes directly to the directory. obv... :)
 

Latest revision as of 08:12, 14 November 2017

Testing images

my picture Giant pouch