解決したiphoneをWindowsにつないで写真の移動を行うとエラーが出るときがある。理由はmovファイルを転送しようとするときと思われる。（転送できるmovもある。サイズの問題では無さそう）jpg png mp4は問題なし。
iosをアップデートしてファイルの形式が変わったからと予想。それ以前の撮影されたファイルは問題なく転送可能。ios13？以降だとHEICとかmovでも何かしらに変更が入っているのかもしれない。転送時の設定でiphone > 設定 > 写真 一番下の元のフォーマットのままにすればエラー無くなる。
ただwin機だとjpgの元画像になるHEICはデフォルトだと読み込めないのでその辺は臨機応変に。
誰か同じ苦しみがある人に届くといいね。
いっつも感覚で書いてしまうのでバラバラな並び順のプロパティを自動で整形したいと思ってぐぐった。CSSCombってのがあるらしい
ということでVSCODEにインストール
そのまま使うと自分の理想通りのフォーマットにならないので、以下のサイトで整形ルールを決める。
https://csscomb.herokuapp.com/config
一応自分好みの形はこれ
{
"remove-empty-rulesets": true,
"always-semicolon": true,
"color-case": "lower",
"block-indent": " ",
"color-shorthand": true,
"element-case": "lower",
"eof-newline": true,
"leading-zero": false,
"quotes": "double",
"sort-order-fallback": "abc",
"space-before-colon": "",
"space-after-colon": " ",
"space-before-combinator": " ",
"space-after-combinator": " ",
"space-between-declarations": "\n",
"space-before-opening-brace": " ",
"space-after-opening-brace": "\n",
"space-after-selector-delimiter": "\n",
"space-before-selector-delimiter": " ",
"space-before-closing-brace": "\n",
"strip-spaces": true,
"tab-size": true,
"unitless-zero": true,
"vendor-prefix-align": true
}csscomb.jsonって名前で必要な箇所に保存。
WinだとC>User>.vscode>extensions>mrmlnc~~ >node_modules>csscomb>config>ここ
ずっと原因がわからず、投稿する人が微妙に間違えて記述してるんじゃないか？とか疑惑があったがWordpressの有難迷惑機能らしい。
function.phpで自動変換処理を止められるようなので止めてみた。
エラーがでるかもしれないので監視したほうがよさげ。
参考になりましたー！
1つのXDファイル内でiphone用とPC用のデザインを進めていて、共有用にプレビューを発行したところ・・・
なぜかiphone側（一番最初に作った画面がiphoneの画面）しか吐き出されない。
プロトタイプでページをつなげた部分は一緒に吐き出されるがPC側はまったく吐き出されず。
悩みに悩んだところ、プロトタイプの画面にしてどの画面をアクティブにするか選択しないといけないっぽい。
どこかに説明あったのかな。。。
とある瞬間から管理画面の固定ページの保存が完了しなくなる。
何だろうと思っていたが、原因はタイトルのプラグインのカスタムCSSの入力箇所でコメントアウトが入っていたから。
参考はこちら。
案外気づかないよなー
そういうときは親要素にかかっている影のCSSがbox-shadowになっているかチェック。
もしそうならば、IE11は切り捨てる方向になるがdrop-shadowにすれば子要素の形にあわせて影をつけてくれる。
ちなみにPNGだと透明部分を無視して影をつけてくれる優れもの。
あとはtabの括りの要素をposition relativeにしてtop -50px的な感じてタブの高さ分をマイナスすれば影付きのタブのできあがーり。
imgタグでsvgを設置。
width =”希望の幅”
height=”auto”
基本はこれでOK
でもIE11だと小さかったり大きかったり。
zeplinで書き出したサイズのせいなのかなと思いPC版のサイズで書き出し直し。
なおる
だが、別の箇所で使っているときに結局サイズ感がおかしい
width heightともに数値で設定してもおかしい。
そんなときはsvgをエディタで開いてみてviewboxの値があるかチェックするといいのかも。
とりあえずsvg内のwidth heightと合わせて
viewbox=”0 0 widthの値 heightの値”でやってみたらレスポンシブに対応できた。
よーわからん
とあるサイトをみて初めて知りました。
利用するCSSは
・-webkit-background-clip:text; // これ設定しないとただ単に背景に画像やグラデがはいるだけ。
・-webkit-text-fill-color:transparent; //枠線も透明にしちゃう
・display :inline-block; // blockのままだと全体幅をみちゃう？
記述方法が変わるのと gulp CLIをアップデートしないといけないようです
参考
http://webdev.jp.net/gulp4-typeerror-gulp-cli/