Jump to content
  • Dance the Night Away

       (1 review)

    Two images, tabbed posting template! ❤️ Please review!


    Actual Template Not Responsive

    Title here!
    @[tag here] // Outfit // Notes
    blah, this scrolls yall!

    Template code

    <link href="https://fonts.googleapis.com/css?family=Montserrat|Sarina" rel="stylesheet">
    <center>
    <style>
      .dangerzone {height: 229px; width: 450px; border: 1px solid black; background: white; position: relative; margin-top: 25px;}
      .ddanger { position: absolute; top: 11px; left: 11px; height: 206px; width: 425px; border: 1px solid black;}
      .dangertitle {padding-top: 0px; padding-bottom: 0px; padding-left: 10px; padding-right: 10px; background: rgba(0,0,0,.9); height: 35px; width:345px; position: absolute; margin-top: 188px; text-align: right; color: white; font-family: 'Sarina', cursive; font-size: 15px; line-height: 2.2;}
      .dangertitle a {color: white}
      .dangertab {float: left;}
      .dangertab label {display: block; position: absolute; width: 15px; height: 25px; background: rgba(0,0,0,.75); margin-top: 193px; margin-left: 407px; z-index:5;}
      .dangertab [type=radio] {display: none;} 
      .dangercontent {opacity: 0; transition-duration: 0.5s; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s;}
      [type=radio]:checked ~ label {z-index: 5; height: 20px; margin-top: 198px;}
      [type=radio]:checked ~ label ~ .dangercontent {z-index: 4; opacity: 1;}
      .daphne {position: absolute; height: 206px; width: 138px; margin-top: 10px; margin-left: 298px; border: 1px solid black}
      .daphwords {padding-top: 5px; padding-bottom: 5px; padding-left: 10px; padding-right: 10px; height: 196px; margin-top: 10px; margin-left: 9px; border: 1px solid black; width: 258px; position: absolute; text-align: justify; font-family: 'Montserrat', sans-serif; font-size:10px;}
      .daphnecredit {font-family: 'space mono', monospace; color: black; font-size: 8px; position: absolute; top: 217px; left: 440px;}
      .daphnecredit a {font-family: 'space mono', monospace; color: black; font-size: 8px; text-decoration: none;}
    
    </style>
    <div class="dangerzone">
    <div class="dangertab">
    <input type="radio" id="tab-1" name="tab-group-1" checked>
    <label for="tab-1" style=""></label>
      <div class="dangercontent">
      <div class="ddanger"><img src="https://placehold.it/425x206" style="width:100%; height:100%;"></div>
      <div class="dangertitle">Title here!</div>
      <div class="dangertitle" style="font-size: 12px; margin-top: 5px; margin-left: 131px; text-align: left; height: 25px; width: 300px">@[tag here] // <a href="here">Outfit</a> // Notes</div>
      </div>
    </div>
    <div class="dangertab">
      <input type="radio" id="tab-2" name="tab-group-1">
      <label for="tab-2" style="width: 15px; margin-left: 422px; background-color: rgba(255,255,255,.75);"></label>
      <div class="dangercontent">
        <div class="daphne"><img src="https://placehold.it/138x206" style="height:100%; width:100%"></div>
        <div class="daphwords">blah, this scrolls yall!</div>
    </div>
      </div>
      <div class="daphnecredit"><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

    Thatmanzai

      

    Maybe I would change the font, in my resolution I hardly see it

    Share this review


    Link to review

×
×
  • 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.