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
3つだけ覚える「flexbox」の使い方 - Qiita
3行で説明、flexboxとは CSS3から導入されたfloatに変わる新しいレイアウト方法です。 伸びたり並んだりします。 俺、flexboxのプロパティ何回ググるんだろう問題 flexboxのプロパティめっちゃ多いですね。正直覚えきれませんし、覚えるつもりもなくなってきます。それに、別に複雑なことをやりたいわけではないですね。 具体的には、下記のようなことができれば十分なんです。 リキッド2カラムレイアウト スティッキーフッタ（最下部に吸い付くフッタ） この程度のものであれば、覚えるべきflexbox関連のCSSプロパティの数も絞れそうです。 覚えておくべき３つのプロパティ display: flex flex: 1 flex-direction: column これだけでわりとこなせます。以下で、実例をもとに説明します。 2カラムレイアウト さて、よくある2カラムレイアウトです。 で
ぼっち対策として、ポートフォリオを作る。（TrelloとVue.jsでプロトタイピング） - Qiita
※現在、当サンプルは動作しません。追記を参照して下さい。 大き目の勉強会に参加すると、たいていぼっちになってしまいます。ピザとチューハイ片手に、邪魔にならない位置にいるしかありません。 自己アピールさえできればなんとかなる場合も多かったと思います。じゃああれですね。ポートフォリオの出番です。作りましょう。 CMSに対する最新の気持ち 書き下すとこんな感じでしょうか。そこは面倒臭がるなよって箇所もありますが。 とりあえずWordPressは嫌 GitHub pages上にホスティングできると、お金かからないし、しかもURLもかっこいい jekyllで生成するのもやってみたけど、いちいちコミットしてPushするのだるいし、環境ないと更新も面倒臭くて、廃墟になってしまった。 だから管理画面がほしいなぁ。 Markdownで書きたい。 画像アップローダもほしい（しかし作りたくはない）。 というか自
AngularJSからVue.jsに移行するガイド - Qiita
最近話題のAngularJSですが、学習コストが辛いのが難点です。 チームでのWebアプリ開発に半年ほど利用していましたが、 「難しい」「辛い」「闇」という声が多かったので、 よりシンプルなVue.jsに移行することにしました。 Vue.jsはAngularのコードを一部利用して作成されており、多くの点で共通した書き方が出来ます。 以下にご紹介します。 （カスタムDirective作るほど使い込んでいなかったので、あくまで初歩的なサンプルとなります。ご容赦ください） AngularJSの基本形 基本的に、バインドする変数やメソッドを$scopeに生やす形になります。 var Ctrl(function($scope) { //バインドする変数宣言 $scope.message = "Hello, World"; //メソッド宣言 $scope.method = function(){/*
フロントエンド開発の３ステップ（npmことはじめ） - Qiita
スライド 当記事は以前勉強会でLTしたものです。 スライドは下記にあります。 フロントエンド覚えること多すぎ問題 モダンなフロントエンド開発で、入門記事を探そうとすると、 まずwebpackやTypeScript, Babelによるビルド環境構築から始まる記事が多くヒットします。 ですが、Node.jsの初心者がいきなり複数のツールを習得しようとすることが 挫折の原因になっていると感じています。 ですので、まずNode.jsをインストールした直後から、必ず使うことになる、 npmの機能をまず覚えておきましょう。 フロントエンド開発で覚えるべき３つのコマンド 以下の3つだけ覚えておきましょう。 npm init npm install npm run これだけ覚えれば、ひとまずフロントエンド開発を進めることができます。 完璧なワークフローを構築するのは、書いているアプリが大きくなってきてから
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
