w3cのバリデートで下記のエラーがでます。
.u-flexiblebox-centaring-all Lexical error at line 1, column 15139. Encountered: "?" (63), after : "" }???:#000;???:skewY(6deg);??? .u-zindex-bottom{z-index:-100}
/* 上下中央揃え-揃えたい要素の親要素につける */ .u-flexiblebox-centaring-all { display: flex; align-items: center; /* 縦方向中央揃え */ justify-content: center; /* 横方向中央揃え */ } /* color - utility --------------------------------------------------------- */ .u-color-white { color: rgba(255, 255, 255, 1); } .u-color-black { color: #000; } /* skew - utility --------------------------------------------------------- */ .u-skewY-6deg { transform: skewY(6deg); } /* zindex - utility --------------------------------------------------------- */ .u-zindex-bottom { z-index: -100; }
/* 上下中央揃え-揃えたい要素の親要素につける /
.u-flexiblebox-centaring-all {
display: flex;
align-items: center; / 縦方向中央揃え /
justify-content: center; / 横方向中央揃え */
}
を削除するとでなくなります。
postcssを使っているので、トランスパイル後に何かあるようです。
トランスパイル後
u-flexiblebox-centaring-all{ display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}}:#000;}:skewY(6deg);}
なぜかだいぶおかしな入れ子にトランスパイルされているようですが、
なぜgulpでやるとこんな風になるのですかね?
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2016/11/22 04:33
2016/11/22 04:41
退会済みユーザー
2016/11/22 07:32