問題タブ [yui-pure-css]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
html - 水平レスポンシブ ナビゲーション バー PureCSS のトラブル
css - PureCSS と CSS メニューのドロップダウン
私は PureCSS を使用しようとしており、CSS を使用してメニュードロップダウンを取得しようとしています (移植性の理由から YUI または Jquery を使用するのではなく)。
これは私がこれまでに持っているものです:
http://jsfiddle.net/ket262p3/3/
と:
根本的な問題は、2 番目のレベルのメニューが表示されない原因となる purecss の微妙な部分である可能性があると思います。
余分なクラスは無視してください。これらは、これを YUI または JQuery で動作させるための初期段階を表しています。
css - PureCSS Grid が Firefox を中心としていない
私は自分の Web サイトでPureCSSを試していますが、すべてうまくいっているように見えました。Firefox で開いたところ、コンテンツが中央に配置されていないことに気付きました。
HTML/CSS はとてもシンプルです。<div class="content pure-u-1 pure-u-md-3-5">
インスペクター ツールを開くと、幅 60% で正しくレンダリングされていることがわかります。もしそうなら、なぜそうではないのか
コンテンツを Firefox の中央に配置するには? Chrome ではすべて正常に動作します。フロントエンドの作業を行ってからしばらく経ちましたが、簡単に検索したところ、まだmargin: 0 auto;
センタリングを推奨している人がいるので、これはグリッド フレームワークと関係があると思いますか? また、すべてをに設定していbox-sizing: border-box;
ます。
css - 純粋な css でネストされたグリッドを使用する方法の例
ドキュメントには、ネストされたグリッドの例は含まれていません。誰かがネストされたグリッドの例を投稿できますか
html - テーブルを画面幅に合わせる // purecss
Web ページのデザインに純粋な CSS を使用しています。私のページにこのテーブル/フォームがあります。残念ながら、それは私の画面の幅を超えています。画面に収まるようにテーブルを自動的にフォーマットするにはどうすればよいですか? テーブルがユーザーの画面幅に収まるまで、各列を「縮小」したいと思います。
html - purecss pure-menu-item が正しく動作しない
このメニュー コードはhttp://purecss.io/menus/の最初の例です。
それでもうまくいきません:(
各<li>
アイテムは、互いに画面いっぱいの距離を保っています。下にスクロールすると、他の項目が表示されます。
しかし、それは purecss.io/menus ページで動作します。どうしてか分かりません。
(ここで実行しても問題なく動作します... このコードで html ドキュメントを作成する必要がありますが、失敗します...)
があるのを見たことpure-menu-item
がありheight: 100%
ますが、これは少し奇妙だと思います。これが問題ですか?
css - 純粋な CSS: Firefox と Opera でレスポンシブ画像がボーダーボックスとパディングで列を分割する
WordPress のテーマ / レイアウトの基礎として、Yahoo Pure CSS のレスポンシブ グリッドを使用しています。
http://smartwatchapps.co.uk/module-test/
画像のない列は問題ありません。画像が存在する場合、列は FF と Opera で展開されます。クローム/サファリOK。
これは、 http://purecss.io/grids/に従って、box-sizing:border-box と水平パディングを Pure ユニットに追加すると発生します。
ピュア ユニットの box-sizing:border-box とパディングを削除し、ピュア ユニット内の div に追加すると、同じことが起こります。
幅の追加: 100% は FF と Opera のオーバーフロー画像を修正しますが、もちろんこれによりすべての画像がコンテナーの 100% 幅になります (たとえば、このページの OJ の小さな画像は、コンテナーの 100% を埋めるように拡張されます)。実行可能な解決策ではありません。
pure-g が別のページ内にネストされていない他のページでは発生しないようです。
http://smartwatchapps.co.uk/markup-image-alignment/
どんなアイデアでも大歓迎です。