update

gamerinshaft · May 30, 2015 · c379755 · c379755
1 parent fcc8667
commit c379755
Show file tree

Hide file tree

Showing 2 changed files with 64 additions and 7 deletions.
diff --git a/css/base-layout.css b/css/base-layout.css
@@ -673,7 +673,21 @@
 .hidden-xs{
   display: none;
 }
-
+.flex-fluid-xs-66{
+  display: block;
+  max-width: 66.6%;
+  flex: 0 0 66.6%;
+}
+.flex-fluid-xs-33{
+  display: block;
+  max-width: 33.3%;
+  flex: 0 0 33.3%;
+}
+.flex-fluid-xs-16{
+  display: block;
+  max-width: 16.6%;
+  flex: 0 0 16.6%;
+}
 .flex-xs-auto{
   display: block;
   flex: 1;
@@ -780,6 +794,21 @@
 }
 
 @media (min-width: 768px){
+  .flex-fluid-sm-66{
+    display: block;
+    max-width: 66.6%;
+    flex: 0 0 66.6%;
+  }
+  .flex-fluid-sm-33{
+    display: block;
+    max-width: 33.3%;
+    flex: 0 0 33.3%;
+  }
+  .flex-fluid-sm-16{
+    display: block;
+    max-width: 16.6%;
+    flex: 0 0 16.6%;
+  }
   .hidden-sm{
     display: none;
   }
@@ -890,6 +919,21 @@
 }
 
 @media (min-width: 960px){
+  .flex-fluid-md-66{
+    display: block;
+    max-width: 66.6%;
+    flex: 0 0 66.6%;
+  }
+  .flex-fluid-md-33{
+    display: block;
+    max-width: 33.3%;
+    flex: 0 0 33.3%;
+  }
+  .flex-fluid-md-16{
+    display: block;
+    max-width: 16.6%;
+    flex: 0 0 16.6%;
+  }
   .hidden-md{
     display: none;
   }
@@ -1000,6 +1044,21 @@
 }
 
 @media (min-width: 1280px){
+  .flex-fluid-lg-66{
+    display: block;
+    max-width: 66.6%;
+    flex: 0 0 66.6%;
+  }
+  .flex-fluid-lg-33{
+    display: block;
+    max-width: 33.3%;
+    flex: 0 0 33.3%;
+  }
+  .flex-fluid-lg-16{
+    display: block;
+    max-width: 16.6%;
+    flex: 0 0 16.6%;
+  }
   .hidden-lg{
     display: none;
   }

diff --git a/css/layout.css b/css/layout.css
@@ -24,7 +24,7 @@ valueに関してはこのようにして取得するイメージ。
 
 ```
 <div class="row">
-  <div class="flex flex-lg-5">
+  <div class="flex flex-lg-auto flex-fluid-sm-33">
     <div class="frame z1 card aspectwrapper-2by3">
       <div class="content">
         <div class="top z2 aspectwrapper-3by2">
@@ -53,7 +53,7 @@ valueに関してはこのようにして取得するイメージ。
       </div>
     </div>
   </div>
-  <div class="flex flex-lg-5">
+  <div class="flex flex-lg-auto flex-fluid-sm-33">
     <div class="frame z1 card aspectwrapper-2by3">
       <div class="content">
         <div class="top z2 aspectwrapper-3by2">
@@ -82,7 +82,7 @@ valueに関してはこのようにして取得するイメージ。
       </div>
     </div>
   </div>
-  <div class="flex flex-lg-5">
+  <div class="flex flex-lg-auto flex-fluid-sm-33">
     <div class="frame z1 card aspectwrapper-2by3">
       <div class="content">
         <div class="top z2 aspectwrapper-3by2">
@@ -111,7 +111,7 @@ valueに関してはこのようにして取得するイメージ。
       </div>
     </div>
   </div>
-  <div class="flex flex-lg-5">
+  <div class="flex flex-lg-auto flex-fluid-sm-33">
     <div class="frame z1 card aspectwrapper-2by3">
       <div class="content">
         <div class="top z2 aspectwrapper-3by2">
@@ -147,9 +147,7 @@ valueに関してはこのようにして取得するイメージ。
   margin: 0 auto;
   height: 375px;
   min-height: 375px;
-  max-height: 375px;
   width: 235px;
-  min-width: 235px;
   max-width: 235px;
   background-color: rgb(249, 37, 113);
 }