Advertisement
sumakaki

style_flexbox

Nov 23rd, 2020
49
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 1.01 KB | None | 0 0
  1. .wraper{
  2.     display: flex;
  3.     flex-direction: column;
  4. }
  5.  
  6. nav{
  7.     font-size: 30px;
  8.     color: #deb887;
  9.     ul{
  10.         list-style-type: none;
  11.     }
  12. }
  13. header{
  14.     display: flex;
  15.     justify-content: space-between;
  16.     height: 200px;
  17.     background-color: #dcdcdc;
  18.     align-items: flex-end;
  19.  
  20.     .logo{
  21.         align-self: start;
  22.         font-size: 60px;
  23.         color: #f08080;
  24.         margin: 20px 20px 20px 20px;
  25.     }
  26.  
  27.     nav{
  28.         margin: 0px 20px 20px 20px;
  29.        
  30.         display: flex;
  31.         ul{
  32.             display: flex;
  33.             flex-wrap: wrap;
  34.  
  35.             li{
  36.                 padding-right: 30px;
  37.             }
  38.         }
  39.        
  40.     }
  41. }
  42.  
  43. .content{
  44.     display: flex;
  45.     flex-basis: 1000px;
  46.     // flex-grow: 1;
  47.     // flex-shrink: 0;
  48.     // max-width: 1900px;
  49.     margin: 40px;
  50.     justify-content: center;
  51.     h2, p{
  52.         text-align: center;
  53.     }
  54.     img{
  55.         max-width: 100%;
  56.     }
  57.     p{
  58.         padding: 10px;
  59.     }
  60.     .body_content{
  61.         // flex-basis: 22%;
  62.        
  63.         display: flex;
  64.         flex-wrap: wrap;
  65.         justify-content: space-between;
  66.         margin-right: -15px;
  67.  
  68.         .block_item{
  69.             margin-right: 15px;
  70.             flex-basis: 20%;
  71.             flex-shrink: 0;
  72.         }
  73.     }
  74. }
  75.  
  76.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement