サポート » 使い方全般 » 画像のカラム表示のさせ方

  • WordPress初心者です。
    画像の挿入を、メディアの追加→ギャラリーの作成→3カラム(横並び)で作成しております。
    ですが、画像が重なって表示されてしまうのと、スマホで見たときに、画像が小さすぎてしまいます。
    ・画像が重ならないように3つ並べたい
    ・スマホで見たときは縦並び1カラムで表示させたい
    のですが、ご教授いただけますでしょうか。
    完全初心者のため、不明瞭な点がございましたらすみません。

4件の返信を表示中 - 1 - 4件目 (全4件中)
  • こんにちは

    テーマまたは動作を確認できるサイトの URL をご提示されると回答を得やすいと思います。

    RICK

    (@rickaddison7634)

    加減はよくわかりませんが、下記を追加CSS等に追記してはいかがでしょうか?

    
    div[id^="gallery-"].gallery-columns-3 .gallery-item {
    	float: none !important;
    	width: 100% !important;
    	margin:auto;
    }
    @media (min-width:1024px) {
    	div[id^="gallery-"].gallery-columns-3 {
    		display:flex;
    		align-items:center;
    		justify-content:center;
    		margin: auto;
    		width:100%;
    	}
    	div[id^="gallery"].gallery-columns-3 .gallery-item {
    		float: none !important;
    		width: 31% !important;
    		margin:auto;
    	}
    }
    

    @media (min-width:1024px)の中の

    
    div[id^="gallery"].gallery-columns-3 .gallery-item {
    	float: none !important;
    	width: 31% !important;
    	margin:auto;
    }
    

    のwidthとmarginをいじることで微調整できます。

    RICK

    (@rickaddison7634)

    上記でうまくいかない場合は
    img{ max-width:100%; }
    を追記すれば良いかもしれません。
    これ以上は

    • お使いのテーマ(100%GPLかつ無料のものに限る)
    • あなたのサイトのURL

    の情報がないとこちらとしてはどうしょうもありません。

    • この返信は4 ヶ月、 1 週前に  RICK さんが編集しました。
    yuki

    (@yuki84yuki)

    WordPress 5.0以上でブロックエディタを利用出来るのであれば
    カラムブロックを追加し、それぞれに画像を配置する事で実現できると思います。

4件の返信を表示中 - 1 - 4件目 (全4件中)
  • このトピックに返信するにはログインが必要です。