Guest User

Template

a guest
Aug 5th, 2017
109
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.12 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>End of the World</title>
  5. <style type="text/css">
  6.  
  7. body {
  8. background-color: #795bd9;
  9. }
  10.  
  11. .container {
  12. justify-content: center;
  13. display: flex;
  14. }
  15.  
  16. .picture-box1 {
  17. background-image: url("http://i.imgur.com/wWmTVrA.jpg");
  18. height: 300px;
  19. width: 150px;
  20. float: left;
  21. border-width: 5px;
  22. border-style: solid;
  23. border-color: #000000;
  24. }
  25.  
  26. .picture-box2 {
  27. background-image: url("http://i.imgur.com/wWmTVrA.jpg");
  28. height: 300px;
  29. width: 150px;
  30. float: right;
  31. border-width: 5px;
  32. border-style: solid;
  33. border-color: #000000;
  34. }
  35.  
  36. .link-box {
  37. background-color: #fff;
  38. padding: 0px;
  39. height: 300px;
  40. width: 550px;
  41. text-align: center;
  42. margin-right: 5px;
  43. margin-left: 5px;
  44. border-width: 5px;
  45. border-style: solid;
  46. border-color: #000000;
  47. }
  48.  
  49. .welcome {
  50. text-align: center;
  51. font-size: 24px;
  52. position: absolute;
  53. padding-top: 30px;
  54.  
  55. }
  56.  
  57. ul {
  58. display: inline-block;
  59. list-style-type: none;
  60. padding-top: 80px;
  61. line-height: 175%;
  62. }
  63.  
  64. li {
  65. padding-left: 20px;
  66. padding-right: 20px;
  67. text-align: left;
  68. }
  69.  
  70. a {
  71. text-decoration: none;
  72. }
  73. </style>
  74. </head>
  75. <body>
  76. <div class="container">
  77. <div class="picture-box1"></div>
  78. <div class="welcome">Sunlit Garden</div>
  79. <div class="link-box">
  80. <ul>
  81. <li><a href="link">Link</a>
  82. <li><a href="link">Link</a>
  83. <li><a href="link">Link</a>
  84. <li><a href="link">Link</a>
  85. <li><a href="link">Link</a>
  86. </ul>
  87. <ul>
  88. <li><a href="link">Link</a>
  89. <li><a href="link">Link</a>
  90. <li><a href="link">Link</a>
  91. <li><a href="link">Link</a>
  92. <li><a href="link">Link</a>
  93. </ul>
  94. <ul>
  95. <li><a href="link">Link</a>
  96. <li><a href="link">Link</a>
  97. <li><a href="link">Link</a>
  98. <li><a href="link">Link</a>
  99. <li><a href="link">Link</a>
  100. </ul>
  101. </div>
  102. <div class="picture-box2"></div>
  103. </div>
  104.  
  105. </body>
  106. </html>
Advertisement
Add Comment
Please, Sign In to add comment