"ヘリコプター"の意外な真実を知った！｢じゃあドラえもんのアレは・・・｣｢ナランチャは正しかった！！｣ - Togetter

2021/07/04 293 users Togetter 揚力 ナランチャ ホバリング ヘリコプター

リンク Wikipedia ヘリコプター ヘリコプター（英語: helicopter）は、回転翼機に分類される航空機の一種。垂直方向の軸に配置したローター（回転翼）をエンジンの力で回転させて揚力を得て、出力やローターの描く面（回転面・円盤面）を変化させることで進行方向への推進力を得たり、ホバリング（空中での停止）を含め... 続きを読む

垂直方向のマージンにはmargin-topを優先的に使う理由 - Yuhei Yasuda

2021/01/26 276 users margin-top margin-bottom マージン

margin-bottomではなくmargin-topを使う派である旨をツイートしたら理由を尋ねられたので、それに対する回答です。大きくは次の3つです。 末尾の要素の存在が任意である場合が多いため Stackレイアウトとの取り合わせやすさのため 隣接セレクターを使った場合分けができるようにするため CSS、基本コンポーネントの上に... 続きを読む

CSSで、button要素とinput要素のテキストを美しく揃えるスタイルシートのテクニック | コリス

2020/08/24 175 users コリス inpu button要素 input要素 CSS

検索フォームなど、button要素とinput要素を並べて配置した際に、それらのテキスト（アイコンも）を垂直方向に美しく揃えて配置するスタイルシートのテクニックを紹介します。 ボタンと入力フォームの高さは自由に変更でき、デザインも普通に変更できるので、スニペットとして登録しておくと便利です。 button要素とinpu... 続きを読む

MIT Tech Review: 東大、熱を一方向のみに伝えるナノチューブ新素材を開発

2020/01/23 106 users REVIEW カーボンナノチューブ 東大 MIT Tech

東京大学の研究者らがカーボンナノチューブを用いて、ある方向に沿っては熱を伝えるが、その垂直方向にはほとんど熱を伝えない新素材を作り出すことに成功した。コンピューターなどのデバイスの冷却システムを設計・構築する方法に影響を与えそうだ。 by Emerging Technology from the arXiv2020.01.23 282 71 3 4 電気... 続きを読む

ピザを切ったらまな板まで真っ二つに！？『私はピザを切ってたはず…』『こうやって切ったの二回目』 - Togetter

2019/10/27 111 users Togetter 目算 真っ二つ まな板 正方形

「目算で5ミリ厚くらいで正方形のまな板」なんてあるのかどうか知らんが、そもそもまな板用途で売っているものだとは思いにくい。木目に沿って割れるのはカラテエキシビジョンでもよく見る光景、割れるべくして割れている。垂直方向に別のカットが入っているがその時は割れていないだろ？古くもない道具でも変な使い方を... 続きを読む

いよいよ？まだまだ？IE11のサポート終了までのカウントダウンが始まる | コリス

2019/10/21 105 users コリス padding margin supports 足かせ

Web制作において悩みの種の一つが、IE11のサポートです。 main要素に垂直方向のmargin, paddingが効かない、CSS Grid、変数、@supportsなど、IE11が足かせになって使用に躊躇している人も少なくないと思います。 IE11のサポート終了までのカウントダウンが始まりました。 IE11のサポート終了までのカウントダウン IE11は... 続きを読む

CSSの作業効率がアップする、少し高度な使い方のまとめ | コリス

2018/03/19 253 users コリス padding CSS マージ 作業効率

Webページやスマホアプリをはじめ、レスポンシブ対応ページなどで役立つ、CSSのあまり知られていない仕様や少し高度な使い方を紹介します。 Lesser known CSS quirks & advanced tips 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 01. 垂直方向のpaddingは要素の幅に対して相対的 02. マージ... 続きを読む

【翻訳】私がコーディングで垂直方向にそろえるインデントをとる理由 | POSTD

2015/01/20 620 users インデント POSTD コーディングスタイル コーディング

先週、Hacker News上で興味深い議論が行われました。テーマはLinux Kernelのコーディングスタイルについてです。 議論の中で私は、コーディングで垂直方向にそろえるインデントをとるべきかというささやかな聖戦 […]先週、Hacker News上で興味深い議論が行われました。テーマはLinux Kernelのコーディングスタイルについてです。 議論の中で私は、コーディングで垂直方向にそ... 続きを読む

[CSS]画像一枚だけで写真を重ねたようにするチュートリアル | コリス

2012/06/04 165 users コリス チュートリアル CSS stack div

デモページ ※ホバー時のアニメーションはFirefoxのみです。 実装 HTML HTMLは非常にシンプルです。 ラッパーのdiv要素はWebkit系ブラウザ用で、将来無しでも機能するようになるかもしれません。 <div class="stack"> <img src="image1.jpg" /> </div> まずは、右端の写真が垂直方向に重なっただけのスタイルシートです。重なりは:befor... 続きを読む

[CSS]画像の天地の上限を設定し、垂直方向の中央に配置するCSSのテクニック | コリス

2011/11/28 102 users コリス wrapper overflow CSS Hidden

デモページ：幅480pxで表示 実装 実装のイメージ 画像のサイズは100%で設定し、高さ・幅の上限は画像を内包するdiv要素で設定します。 また、垂直方向の中央に配置するために、「overflow: hidden;」を使って余剰分を隠します。 HTML 画像はimg要素で配置し、div要素で内包します。 <div class="image-wrap" id="wrapper"> <img src... 続きを読む

[JS]シンプル！高性能！超軽量！使い勝手の良いコンテンツスライダーのスクリプト -jContent | コリス

2011/04/11 179 users コリス スライダー div要素 スクリプト デモ

デモ：カルーセル機能付きのスライダー：垂直方向 jContentの実装 実装は簡単で、パネル内のコンテンツをdiv要素で配置し、数行のスクリプトを記述するだけです。 HTML ... ... .... 続きを読む

[CSS]ブラウザのサイズに合わせて垂直・水平方向に可変するレイアウト -SuperStretch! | コリス

2010/06/20 201 users コリス CSS 水平方向 レイアウト ブラウザ

ブラウザのサイズに合わせて、垂直方向にも水平方向にも可変するレイアウトを紹介します。 SuperStretch! – A Vertically Fluid Layout Using CSS デモページ デモページはブ [...] 続きを読む

マージンの相殺について：CSS | Tech de Go

2007/05/22 409 users マージン 相殺 CSS Tech de Go とおり

垂直方向のマージンの相殺(margin collapsing)についてです。特に難しいことはないですが、レイアウトする時は気にする必要があると思います。 マージンの相殺は、各ブラウザが実装しても、しなくてもいい仕様だそうです。ここで述べられている内容は、Firefox2, IE6, Opera9ではそのとおりになります。ただし、IE6では”haslayout”になると、マージンの相殺は起こらないよ... 続きを読む

DIVを垂直方向に中央寄せするCSSサンプル:phpspot開発日誌

2006/12/04 385 users div height プロパティ CSS div要素

Blue Box Demo: Vertical Centering with a Shiv Div DIVを垂直方向に中央寄せするCSSサンプル。 次のように、DIV要素をブラウザの縦方向に配置できます。 CSSは非常にシンプルで、まず、html と body 要素に height:100% プロパティを設定します。 次に、body内にdiv要素を配置し、そのdiv要素に対し、height:50%... 続きを読む