タグ

flexに関するextra_numberのブックマーク (5)

  • gapの余白指定が便利! gridとflexでできる新しいCSSレイアウト手法 - ICS MEDIA

    CSSのgapプロパティーは余白を指定できる新しめの手法です。余白といえば、marginプロパティーやpaddingプロパティーを思い浮かべる方が多いと思いますが、CSS GridやFlexboxでgapプロパティーを使うと柔軟にレイアウトを組めます。もともとgapプロパティーはCSS Gridでのみ利用できていましたが、macOS Safari 14.1およびSafari on iOS 14.6からFlexboxでもgapプロパティーが使えるようになりました。 この記事ではFlexbox、CSS Gridで利用できるgapプロパティーを活用したレイアウト手法とそのメリットを紹介します。今までmarginプロパティーで要素間の余白を調整していたものもgapプロパティーで柔軟に対応できる場面もあります。なお、下記サンプルでmarginプロパティーは一切使っていません。 サンプルを別ウインドウ

    gapの余白指定が便利! gridとflexでできる新しいCSSレイアウト手法 - ICS MEDIA
  • CSS Flexboxのレイアウトで起きる厄介な問題をJavaScriptを使用せずに、解決するテクニック

    CSS Flexboxの利点は柔軟なレイアウトを行えることです。しかし、そのフレキシブルさがネックになってしまうことがあります。 ここ数ヵ月の間、あちこちのブログやコミュニティで議論されていたFlexboxのレイアウトで起きる厄介な問題が解決したようなので、紹介します。 The Flexbox Holy Albatross by Heydon Pickering 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに CSSレイアウトの厄介な問題 Media Queryで実装する -ばかげてます JavaScriptで実装する CSSで解決 はじめに 私はこの6ヵ月の間、さまざまな活動に取り組んでいました。 ※これらに限定されるものではありません。 頭をかきむしる 窓の外をみつめる ベッドで天井をみつめる 枕に叫ぶ 呪文をつぶ

    CSS Flexboxのレイアウトで起きる厄介な問題をJavaScriptを使用せずに、解決するテクニック
  • 無料でFlashの制作環境を構築 FlashDevelopとFlex SDKのインストール | ClockMaker Blog

    FlashDevelop(フラッシュ・デベロップ)というActionScriptのエディターが非常に優秀で、これとAdobeがオープンソースで提供しているFlex SDKがあれば、お手軽かつ無料でFlashを作ることができます。 FlashDevelopはソフトの軽さと強力なコードヒント機能によってプロのFlasherから熱烈な支持を受けているエディターです。まずはコードヒント機能がどのくらい優れているか分かる90秒のライブコーディングビデオを用意しました。 FlashDevelop Code Hint Movie from clockmaker on Vimeo. コードの補間によってキータイプの量を劇的に減らせ、自動的に整形されるため見通しの良いコードが仕上がるのがおわかりになるかと思います。 では、そんな便利で高機能なFlashDevelopのインストール方法を紹介します。できる限り

    無料でFlashの制作環境を構築 FlashDevelopとFlex SDKのインストール | ClockMaker Blog
  • 「Q.films」のソースを公開しました | ClockMaker Blog

    公約していたとおり、自主制作映画上映会「Q.films」の告知サイトのソースファイルを公開します。 souce (zip) 一応、区分としてはフルフラッシュサイトになると思いますが、この規模のサイトのソースが公開されている例は少ないと思いますので、何らかのお役に立てれば幸いです。Flex SDKで作っているのでFlash CS3/CS4を持っていなくてもセットアップすれば無料で試すことができるはずです(この記事が参考になるかも)。 注意点として、 フォントは抜いてますので使用する際は適宜設定ください。またメンバー紹介はダミー画像に差し替えてます。 2/11(水)から2/15(日)まで上映会です あと、お伝えしたいこととして今日から上映会です。私も含め社会人が休日に制作したエンターテイメントな映画を上映しますので気楽に楽しめるかと思います。映画の他にも私のモーショングラフィックス作品も上映し

    「Q.films」のソースを公開しました | ClockMaker Blog
  • Flash Catalyst+Flex 4でコラボしてみる - builder by ZDNet Japan

    アドビがRIA開発におけるUIデザインツールとして発表した「Flash Catalyst」。デザイナーはFlash Catalystを使って、Illustratorなどでデザインしたパーツに対して、コードを書くことなくインタラクションを加えることができる。 11月にAdobeが発表した「Flash Catalyst」は、デザイナーとデベロッパーの架け橋となるツールだ。Flash Catalystを利用すると、デザイナーはコードを書くことなく、UIのインタラクションを開発することができる。これは、開発者がFlexを使ってUIを実装する段階においても、デザイナーがデザインに関与できるという意味を持っている。 Flash CatalystはAdobeが夢見るRIA開発ワークフローの要ともいえる製品なのだ。 連載「Flash Catalyst+Flex 4でコラボしてみた」では、デザイナーと

  • 1