Jump to content
  • Bulletin Board Realness

       (1 review)

    Pretty lore code! ❤️ Please review!


    Actual Template Not Responsive

    Title here
    • Quick facts here!
    • Seperate them with 'li'!
    • Yay!!!
    • Just keep it in the 'ul' tags!
    • Oh, and like the other div tags here...
    • This should scroll just fine!
    All the info you want here!Blah Blah blah, this should scroll btw! This is what italics look like! And this is what bolding looks like! Bolded italics? No problem!

    All the info you want here! What's changed from the books? Blah Blah blah, this should scroll btw!

    Subtitle:

    All the info you want here!Blah Blah blah, this should scroll btw! This is what italics look like! And this is what bolding looks like! Bolded italics? No problem!

    All the info you want here! What's changed from the books? Blah Blah blah, this should scroll btw!

    Quick info 1
    Quick info 2
    Quick info 3
    Quick info 4
    Quick info 5
    Quick info 6

    Template code

    <link href="https://fonts.googleapis.com/css?family=Abril+Fatface|Merriweather" rel="stylesheet">
    <center>
    <style>
      .bombcan {height: 500px; width: 500px; position: relative; background-image: url(https://images.rpginitiative.com/uploads/monthly_2018_07/large.background-1646006_960_720.jpg.41cbc17e3f9dd1a7a341b06155ccba93.jpg); background-size: 15%}  
      .ministry {height: 450px; width: 450px; background: white; position: absolute; top: 25px; left: 25px;}
      .headline {padding: 10px; height: 45px; width: 460px; background: #90D4C1; position: absolute; z-index: 2; top: 25px; left: 10px; font-family: 'Abril Fatface', cursive; font-size: 25px; text-decoration: underline; line-height: 1.75; font-style: italic; }
      .fastfacts {border-left: 1px solid gray; border-bottom: 1px solid gray; padding: 10px; height: 120px; width: 150px; position: absolute; top: 85px; left: 265px; overflow: auto; font-family: 'Merriweather', serif;}
      .fastfacts ul {list-style-image: url(https://images.rpginitiative.com/uploads/monthly_2018_07/large.icon_search_arrow_down.png.ffa2f83d19648c3b2095b9394ca6b6b9.png); margin: 0px; padding-left: 25px; text-align: justify; font-size: 12px;}
      .info {padding-left: 10px; padding-right: 10px; padding-top: 5px; padding-bottom: 5px; text-align: justify; border-bottom: 1px solid gray; top: 85px; position: absolute; left: 25px; height: 150px; width: 210px; font-family: 'Merriweather', serif; font-size: 12px; overflow: auto}
      .boxy {padding: 5px; height: 18px; width: 185px; background: #90d4c1; position: absolute; top: 260px; left: 295px; font-family: 'Abril Fatface', cursive; font-size: 12px; overflow: hidden;}
      .potter {font-size: 12px; text-align: justify; border-right: 1px solid gray; position: absolute; width: 220px; overflow: auto; font-family: 'Merriweather', serif; height: 150px; padding: 10px; top: 265px; left: 25px;}
      .potter h1 {font-family: 'Abril Fatface', cursive; text-align: center; font-size: 20px; padding-top: 0px; line-height: .5; text-decoration: underline; letter-spacing: 1.25}
      .pottercredit {font-family: 'space mono', monospace; color: white; font-size: 8px; position: absolute; top: 480px; left: 250px;}
      .pottercredit a {font-family: 'space mono', monospace; color: white; font-size: 8px; text-decoration: none;}
    
    </style>
    <div class="bombcan"><div class="headline">Title here</div><div class="ministry"> 
      <div class="fastfacts"><ul><li>Quick facts here!</li><li>Seperate them with 'li'!</li><li>Yay!!!</li><li>Just keep it in the 'ul' tags!</li><li>Oh, and like the other div tags here...</li><li>This should scroll just fine!</li></ul></div>
      <div class="info">All the info you want here!Blah Blah blah, this should scroll btw! <i>This is what italics look like!</i> <b>And this is what bolding looks like!</b> <i><b>Bolded italics? No problem!</b></i><p>All the info you want here! What's changed from the books? Blah Blah blah, this should scroll btw! </div>
      <div class="potter"><h1>Subtitle:</h1>All the info you want here!Blah Blah blah, this should scroll btw! <i>This is what italics look like!</i> <b>And this is what bolding looks like!</b> <i><b>Bolded italics? No problem!</b></i><p>All the info you want here! What's changed from the books? Blah Blah blah, this should scroll btw!</div>
    </div>
      <div class="boxy">Quick info 1</div>
      <div class="boxy" style="top: 295px">Quick info 2</div>
      <div class="boxy" style="top: 330px">Quick info 3</div>
      <div class="boxy" style="top: 365px">Quick info 4</div>
      <div class="boxy" style="top: 400px">Quick info 5</div>
      <div class="boxy" style="top: 435px">Quick info 6</div>
      <div class="pottercredit"><a href="https://rpginitiative.com/profile/2592-penny/">♔</a></div>
    </div>
    </center>



    User Feedback

    Join the conversation

    You can post now and register later. If you have an account, sign in now to post with your account.

    Guest


×
×
  • Create New...

Important Information

By using this site, you agree to our Terms of Use, Guidelines and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.