Flexboxで高さが揃わない場合の直し方。横並び&中央揃えにする正しい記述
まずは普通に組んでみる HTML <div class="example"> <figure><img src="" alt="画像"></figure> <div class="txt"> <h1>タイトル</h1> <p>テキストテキストテキストテキストテキスト</p> </div> </div> CSS .example { display: flex; align-items: center; } .example .txt { background-color: #fff; padding: 30px; } ブラウザによってベンダープレフィックスが必要になります。 2019年最新のベンダープレフィックスは下記記事をご覧ください。
サイト更新時、修正内容がキャッシュで反映されない時の対処法【HTML】
サイト訪問時、サイトのデータをブラウザ側で一時的に保存。再訪問した際、ブラウザに保存されたデータが読み込まれる為、通常より表示速度が速くなる仕組みのこと。 ただ、作り手側からすると、ちょっと面倒な機能でもあります。 制作会社に勤めている方であれば、クライアントから一度は”下記の様な指摘”を受けたことがあるんじゃないでしょうか… 「ちょっ、直してって言ったところ、直ってないよ！ちゃんとしてよ！」ってメールきて、「いやーお客さん。それ、キャッシュ残ってるんですよー・・F5押してリロードしてちょ」って、どーやってマイルドにお伝えするかが問題なんだよねー。 — じゅんべー (@chobineko_jh799) 2011年8月24日 ぼくは、自社運営の会社に勤めている為、クライアントから指摘を受けることはありませんが、たまに「あれっ！？反映されてない..」と焦ることはあります。 特にキャンペーン対応
【CSS】デバイス幅に合わせたサイズ可変のメニューボタンをbackgroundで作る
こんにちは。転職して、コーディングする機会も増えてきましたコーダー初心者井畑です。 今回はスマホのコーディングで苦戦したところがあったので、備忘録としてメモしておきます。 同じような悩みをもっている方の助けになれば幸いです。それではどうぞ! 今回作りたいもの 今回作りたかったのは、上図のようにデバイスの幅にあわせてサイズ可変するメニューボタンです。 問題は、メニューボタンを背景画像(background)として表示することです。これが難しかった… 問題点:背景画像の高さ指定がうまくいかない… 背景画像(background)の幅はデバイスの幅サイズによって可変できるので問題ないのですが、高さは基準となるサイズが無いので、指定しないと高さが0になってしまいます。 だからといって高さを100pxのように指定してしまうと、デバイス幅が変わった時に画像が切れたり、無駄な余白ができてしまいますX(
WordPress のページによってサイドバーを切り替える方法
今回は例として、会社情報ページ(about)は会社情報用のサイドバー。商品紹介ページ(item)のページは商品紹介用のサイドバーに切り替えたい場合の手順を紹介します。 ページ用のサイドバーを用意する それぞれのページで読み込むサイドバーのファイルを用意します。サイドバーのファイル名は、sidebar にハイフンを付けてページのスラッグ名を入れます。今回の場合だと以下のような感じです。 sidebar-about.php sidebar-item.php ページによって切り替える分岐タグ ページによって読み込むサイドバーを切り替えてくれるタグを書きましょう。このタグを書く場所は page.php とか index.php とか人によっては違うと思いますが頑張ってみてください。 <?php if(is_page('about')): ?> <?php get_sidebar('about');
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
