Advertisement
Guest User

Untitled

a guest
Feb 21st, 2017
78
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 6.45 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Disainiprojekt</title>
  6. <link rel="stylesheet" href="css.css">
  7. </head>
  8. <body>
  9. <div class="content">
  10. <div class="row1">
  11. <div class="oneX" id="column6" style="background-color:rgb(70, 29, 124);"></div>
  12. </div>
  13. <div class="row2">
  14. <div class="oneX" id="column2" style="background-color:rgb(117, 73, 177);"></div>
  15. <div class="twoX" id="column4"style="background-color:rgb(70, 29, 124);">
  16. <p class="text1"> ITS YABOI.</p>
  17. </div>
  18. <div class="oneX" id="column4" style="background-color:rgb(70, 29, 124);"></div>
  19. </div>
  20. <div class="row3">
  21. <div class="oneX" id="column1" style="background-color:rgb(117, 73, 177);"></div>
  22. <div class="twoX" style="background-color:rgb(117, 73, 177);">
  23. <p class="text2"> Noor Savage.</p>
  24. </div>
  25. <div class="twoX" id="column4"style="background-color:rgb(70, 29, 124);" ><p class="text1"> Real street nigga.</p></div>
  26. <div class="oneX" id="column4" style="background-color:rgb(70, 29, 124);"></div>
  27. </div>
  28. <div class="row4">
  29. <div class="threeX" id="column4" style="background-color:rgb(117, 73, 177);">
  30. <p class="text3"> tuhh tuhh.</p>
  31. </div>
  32. <div class="oneX" id="column6special" style="background-color:rgb(117, 73, 177);"></div>
  33. </div>
  34. <div class="row5">
  35. <div class="oneX" id="column3" style="background-color:rgb(155, 73, 225);"></div>
  36. <div class="twoX" id="column6" style="background-color:rgb(117, 73, 177);">
  37. <p class="text2"> Bang bang</p>
  38. </div>
  39. <div class="oneX" id="column6" style="background-color:rgb(155, 73, 225);"></div>
  40. </div>
  41. <div class="row6">
  42. <div class="oneX" style="background-color:rgb(252, 236, 174);"></div>
  43. <div class="twoX" style="background-color:rgb(252, 236, 174);">
  44. <p class="text5"> SKRTTTTTTTTTTTTTTT.</p>
  45. </div>
  46. </div>
  47. <div class="row7">
  48. <div class="oneX" style="background-color:rgb(252, 236, 174);"></div>
  49. <div class="twoX" id="column3" style="background-color:rgb(155, 73, 225);"></div>
  50. </div>
  51. <div class="row8">
  52. <div class="oneX" id="invisible"></div>
  53. <div class="twoX" style="background-color:rgb(253, 208, 35);">
  54.  
  55. <p class="text7"> Young savage why u trapping so hard.</p>
  56. </div>
  57. </div>
  58. <div class="row9">
  59. <div class="oneX" style="background-color:rgb(253, 208, 35);"></div>
  60. <div class="twoX" id="column3" style="background-color:rgb(233, 178, 0);">
  61. <p class="text6"> Why these niggas traping so harddd</p>
  62. </div>
  63. </div>
  64. <div class="row10">
  65. <div class="oneX" id="column2" style="background-color:rgb(253, 208, 35);"></div>
  66. </div>
  67. <div class="row11">
  68. <div class="oneX" id="column4" style="background-color:rgb(233, 178, 0);"></div>
  69. </div>
  70.  
  71. <div class="textArea">
  72. <p class="text8"> WHY U GOT A 12 CAR GARAGE</p>
  73. </div>
  74. <!----------------------------------------------------------------------------------->
  75. </div>
  76. </body>
  77. </html>
  78.  
  79.  
  80.  
  81.  
  82.  
  83.  
  84.  
  85.  
  86.  
  87. @import url('https://fonts.googleapis.com/css?family=Open+Sans');
  88.  
  89. .content {
  90. width: 1200px;
  91.  
  92. }
  93.  
  94. .oneX {
  95. vertical-align: top;
  96. position: relative;
  97. display: inline-block;
  98. width: 100px;
  99. height: 100px;
  100.  
  101. margin-right: -4px;
  102. margin-bottom: -4px;
  103. margin-top: -4px;
  104.  
  105. outline:1px solid black;
  106. }
  107. .twoX {
  108. vertical-align: top;
  109. display: inline-block;
  110. position: relative;
  111. height: 200px;
  112. width: 200px;
  113.  
  114. margin-right: -4px;
  115. margin-bottom: -4px;
  116. margin-top: -4px;
  117.  
  118. outline:1px solid black;
  119. }
  120.  
  121. .threeX {
  122. vertical-align: top;
  123. display: inline-block;
  124. position: relative;
  125. height: 300px;
  126. width: 300px;
  127. z-index: -1;
  128. margin-right: -4px;
  129. margin-bottom: -4px;
  130. margin-top: -4px;
  131. outline:1px solid black;
  132. }
  133. #invisible {
  134. background-color: white;
  135. }
  136.  
  137. #column1 {
  138. left: 0;
  139. }
  140.  
  141. #column2 {
  142. left: 100px;
  143. }
  144. #column3 {
  145. left: 200px;
  146. }
  147. #column4 {
  148. left: 300px;
  149. }
  150. #column5 {
  151. left: 400px;
  152. }
  153.  
  154. #column6 {
  155. left: 500px;
  156. }
  157.  
  158. #column7 {
  159. left: 600px;
  160. }
  161. #column8 {
  162. left: 700px;
  163. }
  164. #column9 {
  165. left: 800px;
  166. }
  167. .row1 {
  168. bottom: 7px;
  169. position: relative;
  170. }
  171.  
  172.  
  173. .row3 {
  174. position: relative;
  175. bottom: 92px;
  176. }
  177. .row4 {
  178. position: relative;
  179. bottom: 176px;
  180. }
  181.  
  182. .row4 > .threeX {
  183. position: relative;
  184. bottom: 7px;
  185. }
  186.  
  187.  
  188.  
  189. .row5{
  190. bottom: 376px;
  191. position: relative;
  192. }
  193.  
  194.  
  195. .row6 {
  196. position: relative;
  197. bottom: 469px;
  198. }
  199.  
  200. .row7 {
  201. position: relative;
  202. bottom: 561px;
  203. z-index: -1
  204. }
  205.  
  206. .row7 > .twoX{
  207. margin-top: -3.5px;
  208. position: relative;
  209. top: 2px;
  210.  
  211. }
  212.  
  213. .row8 {
  214. position: relative;
  215. bottom: 655px;
  216. }
  217.  
  218. .row9 {
  219. position: relative;
  220. bottom: 743px;
  221. }
  222.  
  223. .row9 > .oneX{
  224. position: relative;
  225. bottom: 4px;
  226. z-index: -1;
  227. }
  228.  
  229. .row10 {
  230. position: relative;
  231. bottom: 839px;
  232. z-index: -1;
  233. }
  234. .row11 {
  235. position: relative;
  236. bottom: 826px;
  237. }
  238. #column6special {
  239. left: 500px;
  240. bottom: 8px;
  241. }
  242.  
  243. .text1 {
  244. margin: 7px;
  245. color: #FCECAE;
  246. font-family: "Open Sans";
  247. font-size: 18px;
  248. text-align: justify;
  249.  
  250. }
  251.  
  252. .text2 {
  253. margin: 7px;
  254. color: #FFF6D4;
  255. font-family: "Open Sans";
  256. font-size: 18px;
  257. text-align: justify;
  258.  
  259. }
  260.  
  261. .text3 {
  262. margin: 7px;
  263. color: rgb(233, 200, 255);
  264. font-family: "Open Sans";
  265. font-size: 18px;
  266. text-align: justify;
  267.  
  268. }
  269.  
  270. .text5 {
  271. margin: 7px;
  272. color: rgb(40, 0, 19);
  273. font-family: "Open Sans";
  274. font-size: 18px;
  275. text-align: justify;
  276.  
  277. }
  278.  
  279. .text6 {
  280. margin: 7px;
  281. color:rgb(252, 255, 174);
  282. font-family: "Open Sans";
  283. font-size: 18px;
  284. text-align: justify;
  285.  
  286. }
  287.  
  288. .text7 {
  289. margin: 7px;
  290. color: purple;
  291. font-family: "Open Sans";
  292. font-size: 18px;
  293. text-align: justify;
  294.  
  295. }
  296.  
  297. .textArea {
  298. height: 500px;
  299. width: 390px;
  300. position: relative;
  301. bottom: 1315px;
  302. left: 510px;
  303. }
  304.  
  305. .text8 {
  306. margin: 7px;
  307. color: black;
  308. font-family: "Open Sans";
  309. font-size: 18px;
  310. text-align: justify;
  311.  
  312. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement