SHARE
TWEET

Kaan Webpage Homepage CSS Code

a guest Nov 19th, 2019 77 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. body {margin:0;}
  2. /* everything related to style goes here */
  3.         .header,.footer {background-color:darkgreen;}
  4.         .navigation {width:100%; color:white;
  5.         display:flex;
  6.         align-items:center;
  7.         font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";}
  8.         .nav_left {flex:1;}
  9.         .nav_right {display:flex;
  10.         flex:3;
  11.         margin-right:auto;
  12.         justify-content:space-around;
  13.         align-items:center;
  14.         font-family:'Gill Sans', 'Gill Sans MT', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, 'sans-serif';
  15.         }
  16.         .navigation a {color:white;
  17.         text-decoration:none;}
  18. .content{width:100%;
  19.         font-family:'Gill Sans', 'Gill Sans MT', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, 'sans-serif';
  20.         background-color:yellow;
  21.         display:flex;
  22.         align-content:space-around;
  23.         justify-content:center;
  24.         flex-wrap:wrap;
  25.         flex-direction:row;
  26. }
  27. .col_left {flex:1;} /*how much space the left column takes up*/
  28. .col_right {flex:3;} /*how much space the right column takes up*/
  29. .col_left img {width:100%;}
  30. .content_home{background-color: yellow;
  31. width:100%;}
  32. .content_home{a:hover;}
  33. .bottom_box{display:flex;
  34. justify-content: space-between;}
  35. table, th, td { /*to create table borders*/
  36.   border: 1px solid black;
  37.   border-collapse: collapse;
  38. }/*end of border*/
  39. th, td {
  40.   padding: 7px;
  41.   text-align: center;    
  42. }
  43.  
  44. .top_box {
  45.   position: relative;
  46. }
  47.  
  48. .image {
  49.   display: block;
  50.   width: 100%;
  51.   height: auto;
  52. }
  53.  
  54. .overlay {
  55.   position: absolute;
  56.   top: 0;
  57.   bottom: 0;
  58.   left: 0;
  59.   right: 0;
  60.   height: 100%;
  61.   width: 100%;
  62.   opacity: 0;
  63.   transition: .5s ease;
  64.   background-color: black;
  65. }
  66.  
  67. .top_box:hover.overlay {
  68.   opacity: 1;
  69. }
  70.  
  71. .text {
  72.   color: white;
  73.   font-size: 20px;
  74.   position: absolute;
  75.   top: 50%;
  76.   left: 50%;
  77.   -ms-transform: translate(-50%, -50%);
  78.   transform: translate(-50%, -50%);
  79. }
RAW Paste Data
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
 
Top