API tools faq
paste
xinnia

khione

xinnia
Jul 4th, 2020 (edited)
1,213
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 15.31 KB | None | 0 0
raw download clone embed print report
  1. <!-- background div -->
  2. <div align="center">
  3. <div style="background-color:#F1F5F5;width:900px;height:550px;">
  4.  
  5. <!-- pink header -->
  6. <div style="background-color:#F2B7B4;width:900px;height:5px;">
  7. </div>
  8. <!-- left white header -->
  9. <div style="background-color:#fff;border:3px solid #f1f5f5; width:250px;height:40px; margin-left:-645px;">
  10. </div>
  11.  
  12. <!-- right white header/search bar -->
  13. <div style="background-color:#fff;border-top:3px solid #f1f5f5; border-bottom:3px solid #f1f5f5; border-right:3px solid #f1f5f5; width:641px;height:40px; margin-top:-46px;margin-left:256px;">
  14.  
  15. <div style="background-color:#f1f5f5;border:1px solid #e1e1e1; width:170px;height:23px; margin-top:7px;margin-left:-450px;">
  16. <img src="https://i.imgur.com/BQ10A3m.png" height="25px" style="margin-top:-1px; margin-left:175px;">
  17. </div>
  18. </div>
  19.  
  20.  
  21. <!-- profile picture (edit the link here!) -->
  22. <div style="width:120px;height:120px;margin-top:50px;margin-left:-650px;">
  23.     <img src="https://i.pinimg.com/originals/9d/66/7e/9d667e74f80e9a17df0a5ac5201f9e71.png" alt="profile picture" width="120" height="120"></div>
  24.  
  25. <!-- profile picture cover -->
  26. <div style="width:120px;height:120px;margin-top:-120px;margin-left:-650px;">
  27.     <img src="https://i.imgur.com/P57XMJR.png" alt="Circular Cover"></div>
  28.  
  29.    
  30. <!-- leftmost background banner -->
  31. <div style="background-color:#fff; border-right:3px solid #f1f5f5; border-left:2px solid #f1f5f5;width:250px;height:499px; margin-left:-644px; margin-top:-170px;">
  32. </div>
  33.  
  34. <!-- username -->
  35. <div style="width:100px;height:10px; font:25pt Arial; letter-spacing:5px; font-variant: small-caps; color:#F2B7B4; padding:5px; margin-left:-666px; margin-top:-330px;">
  36. <b>khione</b>
  37. </div>
  38.  
  39. <!-- status bar -->
  40. <div style="background:url(https://i.imgur.com/zoU2Oec.png); width:200px; height: 20px; margin-top:15px; margin-left:-646px;">
  41. <div style="width:180px; height: 10px;  margin-top:30px;font:8pt Arial;text-align:justify;letter-spacing:.75px; color:#fff; padding-top:3px;">
  42. <b>status</b>   reading•listening•thinking
  43. </div>
  44. </div>
  45.  
  46.  
  47.  
  48.  
  49. <!-- edit announcement box here -->
  50. <div align="center" style="border:1px solid #f1f1f1; width:200px;height:50px;margin-left:-645px; margin-top:15px; padding:5px;">
  51. <div align="center" style="background-color:#fff;width:180px;height:60px;font:6pt Arial;text-align:justify;letter-spacing:1.5px; color:#e1e1e1; margin-top:-10px; padding:5px;">
  52.     hi there! i'm skinny love. this is a handy box that you can makes quick announcements, a short blurb about your contact info, etc., it won't scroll so keep it short.
  53. </div>
  54. </div>
  55.  
  56. <!-- edit links here -->
  57. <div style="border-bottom:1px solid #f1f1f1;width:100px;height:10px;padding:1px; margin-top:15px; margin-left:-740px; padding-bottom:10px;">
  58. <div style="font:6pt arial;letter-spacing:.75px;font-variant:small-caps;text-transform:lowercase;text-align:left;color:#F2B7B4;">
  59. <b>01.</b>
  60. </div>
  61. <div style="width:70px; height:10px; margin-top:-10px;">
  62.     <a href="https://www.howrse.com/member/privateMessage/?to=%D1%95%C4%B8%CE%B9nny+love." style="font:7pt arial;letter-spacing:.75px;font-variant:small-caps;text-transform:lowercase;text-align:left;color:#cacaca;">link one</a>
  63. </div>
  64.     </div>
  65.    
  66. <div style="border-bottom:1px solid #f1f1f1;width:100px;height:10px;padding:1px; margin-top:-22px; margin-left:-550px; padding-bottom:10px;">
  67. <div style="font:6pt arial;letter-spacing:.75px;font-variant:small-caps;text-transform:lowercase;text-align:left;color:#F2B7B4;">
  68. <b>02.</b>
  69. </div>
  70. <div style="width:70px; height:10px; margin-top:-10px;">
  71.     <a href="https://www.howrse.com/member/privateMessage/?to=%D1%95%C4%B8%CE%B9nny+love." style="font:7pt arial;letter-spacing:.75px;font-variant:small-caps;text-transform:lowercase;text-align:left;color:#cacaca;">link two</a>
  72. </div>
  73.     </div>
  74.    
  75. <div style="border-bottom:1px solid #f1f1f1;width:100px;height:10px;padding:1px; margin-top:15px; margin-left:-740px; padding-bottom:10px;">
  76. <div style="font:6pt arial;letter-spacing:.75px;font-variant:small-caps;text-transform:lowercase;text-align:left;color:#F2B7B4;">
  77. <b>03.</b>
  78. </div>
  79. <div style="width:70px; height:10px; margin-top:-10px;">
  80.     <a href="https://www.howrse.com/member/privateMessage/?to=%D1%95%C4%B8%CE%B9nny+love." style="font:7pt arial;letter-spacing:.75px;font-variant:small-caps;text-transform:lowercase;text-align:left;color:#cacaca;">link three</a>
  81. </div>
  82.     </div>
  83.  
  84.    
  85. <div style="border-bottom:1px solid #f1f1f1;width:100px;height:10px;padding:1px; margin-top:-22px; margin-left:-550px; padding-bottom:10px;">
  86. <div style="font:6pt arial;letter-spacing:.75px;font-variant:small-caps;text-transform:lowercase;text-align:left;color:#F2B7B4;">
  87. <b>04.</b>
  88. </div>
  89. <div style="width:70px; height:10px; margin-top:-10px;">
  90.     <a href="https://www.howrse.com/member/privateMessage/?to=%D1%95%C4%B8%CE%B9nny+love." style="font:7pt arial;letter-spacing:.75px;font-variant:small-caps;text-transform:lowercase;text-align:left;color:#cacaca;">link four</a>
  91. </div>
  92.    
  93.    
  94.  
  95. <img src="https://i.imgur.com/PpmE6OA.png" alt="home" width="20" style="margin-top:50px; margin-left:-110px;">
  96. <img src="https://i.imgur.com/DvNzUbF.png" alt="left" width="20" style="margin-top:50px; margin-left:20px;">
  97. <img src="https://i.imgur.com/zmmHiUK.png" alt="right" width="20" style="margin-top:50px; margin-left:20px;">
  98.  
  99. </div>
  100.    
  101.    
  102.  
  103. <!-- credit tag DO NOT REMOVE -->
  104. <div align="center" style="width:123px;height:15px;font:5pt Arial;text-align:justify;letter-spacing:.75px;color:#D7E1E3;margin-top:95px;margin-left:-640px;">
  105.     <a style="font:5pt Arial;text-align:justify;color:#D7E1E3;" href="https://www.howrse.com/joueur/fiche/?id=37091688">(c) skinny love.</a> | 2020 | <a style="font:5pt Arial;text-align:justify;color:#D7E1E3;" href="https://theme-hunter.tumblr.com/post/152789707661/pohroro-106-theme-square-one-preview">inspo</a>
  106. </div>
  107.    
  108.  
  109.  
  110.  
  111. <div align="center" style="width:641px;height:465px; margin-top:-499px;margin-left:257px; padding-bottom:30px; overflow:auto;">
  112.  
  113. <!-- text box #1 -->
  114. <div align="center" style="background-color:#fff;border:1px dotted #D7E1E3;width:270px;height:280px;margin-top:40px;margin-left:-280px; overflow:hidden;">
  115.  
  116. <div align="center" style="width:267px;height:210px;font:8pt Arial;text-align:justify;letter-spacing:.75px;color:#D7E1E3;padding:10px;overflow:auto;">
  117.     Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sit amet massa lacinia, gravida lectus sed, malesuada erat. Phasellus consectetur enim a magna ullamcorper malesuada. Nullam commodo nibh et arcu malesuada vehicula. Donec sit amet nisi lacus. Quisque placerat varius imperdiet. Suspendisse eget magna suscipit, bibendum urna eu, sodales neque. Sed molestie in lacus et imperdiet. In mauris libero, facilisis ac iaculis non, ultricies nec velit. Curabitur auctor orci eu nisi elementum, congue accumsan sapien faucibus. Quisque feugiat dui nibh. Donec ac velit ex. Nam eu lorem faucibus, vehicula lacus sodales, ullamcorper arcu. Sed a massa tempor, molestie eros id, feugiat libero.
  118.     <br><br>
  119.     Vestibulum pellentesque cursus diam, eu ullamcorper ipsum consectetur vitae. Nam rutrum eros sed luctus tristique. Fusce vel euismod dolor, non varius ex. Mauris a justo tortor. In congue justo ligula, ut blandit dolor interdum vitae. Mauris ac libero a magna iaculis viverra. Mauris at elementum risus, et scelerisque mi. Mauris et metus purus. Sed in accumsan nunc. Phasellus mi libero, posuere quis tortor eu, sodales condimentum purus.
  120. </div>
  121.  
  122. <div align="center" style="border-top:2px solid #f1f5f5;width:260px;height:13px;font:9pt Arial;text-align:center;letter-spacing:.75px;color:#000; margin-top:25px;padding:5px;">
  123. <div align="center" style="background-color:#cce9e9;width:90px;height:13px;font:8pt Arial;text-align:center;letter-spacing:.75px;color:#fff;margin-left:10px;">
  124.     title #1
  125. </div>
  126.  
  127. <div align="center" style="width:90px;height:13px;font:7pt Arial;font-variant:small-caps;text-align:center;letter-spacing:.75px;color:#cacaca;margin-left:85px;margin-top:-11px;">
  128.     <b>231 notes</b>
  129. </div>
  130. </div>
  131.  
  132. </div>
  133.  
  134. <!-- text box #2 -->
  135. <div align="center" style="background-color:#fff;border:1px dotted #D7E1E3;width:270px;height:350px;margin-top:-282px; margin-left:300px; overflow:hidden;">
  136.  
  137. <div align="center" style="width:270px;height:280px;font:8pt Arial;text-align:justify;letter-spacing:.75px;color:#D7E1E3; padding:10px;overflow:auto;">
  138.     Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sit amet massa lacinia, gravida lectus sed, malesuada erat. Phasellus consectetur enim a magna ullamcorper malesuada. Nullam commodo nibh et arcu malesuada vehicula. Donec sit amet nisi lacus. Quisque placerat varius imperdiet. Suspendisse eget magna suscipit, bibendum urna eu, sodales neque. Sed molestie in lacus et imperdiet. In mauris libero, facilisis ac iaculis non, ultricies nec velit. Curabitur auctor orci eu nisi elementum, congue accumsan sapien faucibus. Quisque feugiat dui nibh. Donec ac velit ex. Nam eu lorem faucibus, vehicula lacus sodales, ullamcorper arcu. Sed a massa tempor, molestie eros id, feugiat libero.
  139.     <br><br>
  140.     Vestibulum pellentesque cursus diam, eu ullamcorper ipsum consectetur vitae. Nam rutrum eros sed luctus tristique. Fusce vel euismod dolor, non varius ex. Mauris a justo tortor. In congue justo ligula, ut blandit dolor interdum vitae. Mauris ac libero a magna iaculis viverra. Mauris at elementum risus, et scelerisque mi. Mauris et metus purus. Sed in accumsan nunc. Phasellus mi libero, posuere quis tortor eu, sodales condimentum purus.
  141. </div>
  142.  
  143. <div align="center" style="border-top:2px solid #f1f5f5;width:260px; height:13px; font:9pt Arial; text-align:center;letter-spacing:.75px; color:#000; margin-top:25px; padding:5px;">
  144. <div align="center" style="background-color:#cce9e9; width:90px; height:13px; font:8pt Arial; text-align:center;letter-spacing:.75px; color:#fff; margin-left:10px;">
  145.     title #2
  146. </div>
  147.  
  148. <div align="center" style="width:90px; height:13px; font:7pt Arial; font-variant: small-caps; text-align:center;letter-spacing:.75px; color:#cacaca; margin-left:85px; margin-top:-11px;">
  149.     <b>289 notes</b>
  150. </div>
  151. </div>
  152.  
  153. </div>
  154.  
  155. <!-- text box #3 -->
  156. <div align="center" style="background-color:#fff;border:1px dotted #D7E1E3;width:270px;height:100px;margin-top:-50px; margin-left:-280px;">
  157.  
  158. <div align="center" style="width:240px;height:40px;">
  159. <div style="width:10px;height:10px;font:50pt Georgia; color:#F2B7B4; float:left;padding:0px 30px 30px 0px;">“</div>
  160.  
  161. <div align="center" style="width:300px; height:40px; font:10pt georgia;text-align:left;letter-spacing:.75px;color:#F2B7B4; margin-left:-70px; margin-top:13px;">
  162. <i>Be the change you want to see in the world. Here is an avenue for short quotes.</i>
  163. </div>
  164.  
  165. </div>
  166.  
  167. <div align="center" style="border-top:2px solid #f1f5f5;width:260px; height:13px; font:9pt Arial; text-align:center;letter-spacing:.75px; color:#000; margin-top:23px; padding:5px;">
  168. <div align="center" style="background-color:#cce9e9; width:90px; height:13px; font:8pt Arial; text-align:center;letter-spacing:.75px; color:#fff; margin-left:10px;">
  169.     title #3
  170. </div>
  171.  
  172. <div align="center" style="width:90px; height:13px; font:7pt Arial; font-variant: small-caps; text-align:center;letter-spacing:.75px; color:#cacaca; margin-left:85px; margin-top:-11px;">
  173.     <b>709 notes</b>
  174. </div>
  175. </div>
  176.  
  177. </div>
  178.  
  179. <!-- text box #4 -->
  180. <div align="center" style="background-color:#fff;border:1px dotted #D7E1E3;width:270px;height:180px;margin-top:20px; margin-left:-280px; overflow:hidden;">
  181.  
  182. <div align="center" style="width:270px;height:110px;font:8pt Arial;text-align:justify;letter-spacing:.75px;color:#D7E1E3; padding:10px;overflow:auto;">
  183.     Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sit amet massa lacinia, gravida lectus sed, malesuada erat. Phasellus consectetur enim a magna ullamcorper malesuada. Nullam commodo nibh et arcu malesuada vehicula. Donec sit amet nisi lacus. Quisque placerat varius imperdiet. Suspendisse eget magna suscipit, bibendum urna eu, sodales neque. Sed molestie in lacus et imperdiet. In mauris libero, facilisis ac iaculis non, ultricies nec velit. Curabitur auctor orci eu nisi elementum, congue accumsan sapien faucibus. Quisque feugiat dui nibh. Donec ac velit ex. Nam eu lorem faucibus, vehicula lacus sodales, ullamcorper arcu. Sed a massa tempor, molestie eros id, feugiat libero.
  184.     <br><br>
  185.     Vestibulum pellentesque cursus diam, eu ullamcorper ipsum consectetur vitae. Nam rutrum eros sed luctus tristique. Fusce vel euismod dolor, non varius ex. Mauris a justo tortor. In congue justo ligula, ut blandit dolor interdum vitae. Mauris ac libero a magna iaculis viverra. Mauris at elementum risus, et scelerisque mi. Mauris et metus purus. Sed in accumsan nunc. Phasellus mi libero, posuere quis tortor eu, sodales condimentum purus.
  186. </div>
  187.  
  188. <div align="center" style="border-top:2px solid #f1f5f5;width:260px; height:13px; font:9pt Arial; text-align:center;letter-spacing:.75px; color:#000; margin-top:25px; padding:5px;">
  189. <div align="center" style="background-color:#cce9e9; width:90px; height:13px; font:8pt Arial; text-align:center;letter-spacing:.75px; color:#fff; margin-left:10px;">
  190.     title #4
  191. </div>
  192.  
  193. <div align="center" style="width:90px; height:13px; font:7pt Arial; font-variant: small-caps; text-align:center;letter-spacing:.75px; color:#cacaca; margin-left:85px; margin-top:-11px;">
  194.     <b>320 notes</b>
  195. </div>
  196. </div>
  197.  
  198. </div>
  199.  
  200.  
  201. <!-- text box #5 -->
  202. <div align="center" style="background-color:#fff;border:1px dotted #D7E1E3;width:270px;height:233px;margin-top:-235px;margin-left:300px;overflow:hidden;">
  203.  
  204. <div align="center" style="width:270px;height:163px;font:8pt Arial;text-align:justify;letter-spacing:.75px;color:#D7E1E3;padding:10px;overflow:auto;">
  205.     Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sit amet massa lacinia, gravida lectus sed, malesuada erat. Phasellus consectetur enim a magna ullamcorper malesuada. Nullam commodo nibh et arcu malesuada vehicula. Donec sit amet nisi lacus. Quisque placerat varius imperdiet. Suspendisse eget magna suscipit, bibendum urna eu, sodales neque. Sed molestie in lacus et imperdiet. In mauris libero, facilisis ac iaculis non, ultricies nec velit. Curabitur auctor orci eu nisi elementum, congue accumsan sapien faucibus. Quisque feugiat dui nibh. Donec ac velit ex. Nam eu lorem faucibus, vehicula lacus sodales, ullamcorper arcu. Sed a massa tempor, molestie eros id, feugiat libero.
  206.     <br><br>
  207.     Vestibulum pellentesque cursus diam, eu ullamcorper ipsum consectetur vitae. Nam rutrum eros sed luctus tristique. Fusce vel euismod dolor, non varius ex. Mauris a justo tortor. In congue justo ligula, ut blandit dolor interdum vitae. Mauris ac libero a magna iaculis viverra. Mauris at elementum risus, et scelerisque mi. Mauris et metus purus. Sed in accumsan nunc. Phasellus mi libero, posuere quis tortor eu, sodales condimentum purus.
  208. </div>
  209.  
  210. <div align="center" style="border-top:2px solid #f1f5f5;width:260px;height:13px;font:9pt Arial;text-align:center;letter-spacing:.75px;color:#000; margin-top:25px;padding:5px;">
  211. <div align="center" style="background-color:#cce9e9;width:90px;height:13px;font:8pt Arial;text-align:center;letter-spacing:.75px;color:#fff;margin-left:10px;">
  212.     title #5
  213. </div>
  214.  
  215. <div align="center" style="width:90px;height:13px;font:7pt Arial;font-variant:small-caps;text-align:center;letter-spacing:.75px;color:#cacaca;margin-left:85px;margin-top:-11px;">
  216.     <b>289 notes</b>
  217. </div>
  218. </div>
  219. </div>
  220.  
  221. </div>
  222.  
  223.  
  224.  
  225.  
  226.  
  227.  
  228.  
  229. </div>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!