flexboxのバグに立ち向かう（flexboxバグまとめ） - Qiita
注）本文中の「コンテナ」「アイテム」について 本文中でいう「コンテナ」「アイテム」は、flexコンテナとflexアイテムのことを指しています。 コンテナ display: flexや、wrap指定などをする 複数のアイテムを含む アイテム flex: 1 0 0%などの指定をする 1. アイテム潰れる問題（Safari） Chrome Safari 潰れてますね。 起きる条件 Safari なぜ コンテンツの最小サイズを尊重してくれない模様 どうすればいいのか flex-shrinkに0を指定 flex-basisにautoを指定（デフォ値なので、指定がなければそのままでOK） Safari10にて修正済み（つまり、SierraとiOS 10以降では対応不要） 2. align-items:center はみ出す問題 Chrome IE11 はみ出てますね。 起きる条件 IE10-11 f
CSS には vw, vh, vmin, vmax という単位がある | DevelopersIO
例として以下の様な HTML 構造があったとします。 <body> <!-- 画像解像度: 100 x 100 (px)--> <img src="images/thumbnail.jpg" /> </body> img { display: inline-block; margin: auto; width: 10vw; } img の幅を 10vw と指定しています。基準となるビューポートの幅を vw で表すと 100vw となります。iPhone 5S のビューポート幅をピクセルで表すと 320px な訳ですが、10vw はその 1/10 ということで32px が img の幅となります。つまり 1vw は 1% と同じ長さになります。もちろんリキッドレイアウトにも対応した動きを持っています。 Demo - viewport lengthを開く（このサンプルはChromeブラウザでの
ネット広告のプロダクトを作る会社が見ている広告の未来(2018年版)｜usedhonda(CEO of FreakOut HD)
頻繁に書くことでもないので、2018年版とした。 フリークアウトのグループ総会で社員向けに話したことの一部を、実験的に公開してみることにした。狙いは、こういう話を社長が全社員にする会社のカルチャーや、自社の課題を率直に伝えることで採用に繋げたかったのと、広告業界の人にどう受け止められるか知りたかったから。またおそらく数カ月先には海外のカンファレンスなどで話すかもしれないので、フィードバックが欲しいのもある。（お前の言ってることなど、今更過ぎて超レベル低いわーという意見があったら、具体的な根拠を持って教えて欲しいが、自分としては世界中を回って得られた知識・考え方を自分なりに再構成したつもりだ） フリークアウトという会社を簡単に説明すると、日本におけるリアルタイム広告取引を最初に仕掛けたり、LINE社の広告システムや、日本交通のタクシー車内にあるタブレット広告などを手がける、広告ハッカー集団と
ヨーロッパのECサイトの動向からみるモバイルで最適なフォーム
ヨーロッパのECサイトが盛況です。その成功の鍵がモバイルフレンドリーなWebサイトだと言われても、私は驚かないでしょう。昨年は、約2億9,600万人のオンラインユーザーが4550億ユーロをECで使いました。そして、その内16.5％は、モバイルユーザーだったのです。 わずか16％だと思うかもしれませんが、モバイルのシェアの成長率は驚異的です。イギリスの大手小売Argosは、ブラックフライデーの午前中、１時間に700,000回の訪問を受け、デスクトップからの訪問はわずか20％であったと報告しました。 この事実から示唆されるのは、モバイルユーザーにとってもっとも大きなハードルの１つであるフォームの扱い方を、Webデザインに従事する全員が考え直すべきだということです。Form Analyticsを運営する企業UseItBetterによる最近の調査が、考え直す際に大きな助けになるでしょう。この記事で
Hyperでイケてるターミナルをつかおう - Qiita
Hyperのプラグイン紹介です 2016年にお前らのターミナルはダサいなんて記事がありましたが、2018年のいまとなってはiTermを使っている時点で色々物足りなくなってきます。そうです、いまは「Hyper」の時代なのです。技術系ブログのスクリーンショットやカンファレンスのライブコーディングなどでHyperのターミナルを見かけることが多く、結構普及してきていると感じてます。そこで、おすすめのHyperのプラグインを紹介します！こんな感じのターミナルになります。 なお、Hyperのプラグイン紹介サイトとしてはawesome hyperがあるのですが、最新のHyperでは動作しないプラグインが結構あり、ハマってしまうので要注意です。。 カラーテーマ：「hyper-material-theme」 Hyperはデフォルトでも真っ黒なターミナルがかっこいいですが、色々なかたがカラーテーマを作っている
[CSS]Media Queriesで使う単位はpx, em, remのどれが適しているか検証 -px指定は注意が必要
レスポンシブ用のMedia Queriesを使う時に「@media (min-width: 400px) {}」のように「px」を単位に使用している人も多いと思います。しかし、px指定には注意が必要です。 Webページでよく使用される条件で検証を行い、Media Queriesでなぜpxを使ってはいけないのか、そして何が適しているのかが分かる検証記事を紹介します。 PX, EM or REM Media Queries? 以下、各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 はじめに pxとemとremの検証方法 検証1. html要素でfont-sizeを指定 検証2. ブラウザでズームが可能 検証3. ブラウザでフォント設定が変更可能 検証の結果 はじめに あなたはMedia Queriesで使う単位にpx, em, remのどれが一番
![[CSS]Media Queriesで使う単位はpx, em, remのどれが適しているか検証 -px指定は注意が必要](https://cdn-ak-scissors.b.st-hatena.com/image/square/ebb660a3174b5d3836e1ab0370b94c0ac1d1e64a/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201601%2F2016032901.png)
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
