Difference between revisions of "Template:CCU Taiwan/css"

(Undo revision 411431 by Herboku (talk))
Line 1,489: Line 1,489:
 
}
 
}
  
 +
.container1{background:#eee;}
 +
.articles{
 +
  display:flex;
 +
  overflow:hidden;
 +
  flex-wrap:wrap;
 +
  align-items:stretch;
 +
}
 +
.articleShort{
 +
  display:flex;
 +
  //flex: 0 1 50%; //controll the width, default 1 1 0%
 +
  flex:1 1 0%; //really buggy in safari IOS
 +
 
 +
}
 +
.articleMain{
 +
  display:flex;
 +
  flex: 1 1 100%; //controll the width, default 1 1 0%
 +
}
 +
.card1{
 +
display:flex;
 +
  align-items: center;
 +
  overflow:hidden;
 +
  background-color:white;
 +
  //padding:15px;
 +
  margin: 15px;
 +
 
 +
    .card-content1{
 +
      display:flex;
 +
      flex-direction:column;
 +
      align-items:flex-start;
 +
      flex: 1 1 auto;
 +
     
 +
      h3,p{
 +
        max-width: calc(100% - 30px);
 +
        padding-left:30px;
 +
      }
 +
  }
 +
  .card-image1{
 +
    min-width:262px;
 +
    a{
 +
    img{
 +
      //min-width:162px;
 +
  display: block;
 +
max-width: 100%;
 +
height: auto;
 +
 +
    }
 +
  }
 +
  }
 +
 +
}
 +
 +
@media screen and (max-width: 992px) {
 +
.articleShort{
 +
  flex:1 1 100%;
 +
  }
 +
}
 +
@media screen and (max-width: 480px) {
 +
  .card1{flex-direction:column;
 +
  .card-content1{
 +
    h3,p{text-align:center;
 +
    }
 +
    }
 +
    .card-image{
 +
 +
      img{
 +
 +
      }
 +
    }
 +
  }
 +
}
  
 
</style>
 
</style>
 
</html>
 
</html>

Revision as of 12:17, 17 October 2018