VWSとは フォーラム Lightning 固定ページでのスタッフブロックについて

固定ページでのスタッフブロックについて

2件の投稿を表示中 - 1 - 2件目 (全2件中)
  • 投稿者
    投稿
  • #36199

    traveller
    参加者

    スタッフブロックを使用したいのですが、スマホで見ると、PCと同じレイアウトでかなり見にくいです。
    スマホでは2カラムではなく、1カラム(スタッフ画像上/説明文下)などで表示されるような設定は出来ないでしょうか。

    よろしくお願いいたします。

    #36206

    DRILL LANCER
    モデレーター

    急場しのぎ用の CSS の例としては下記が挙げられます。

    /* VK Blocks のスタッフブロックのモバイル時の表示 */
    .wp-block-vk-blocks-staff.vk_staff {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
        align-items: flex-start;
    }
    
    .wp-block-vk-blocks-staff .vk_staff_text {
    	float:none;
    	order: 1;
    	width: 100%
    }
    
    .wp-block-vk-blocks-staff .vk_staff_photo {
        float: none;
        order: 0;
        width: 50%;
    }
    
    @media (min-width: 576px) {
    	.wp-block-vk-blocks-staff.vk_staff {
    	    justify-content: space-between;
    	}
    	.wp-block-vk-blocks-staff .vk_staff_text {
    		order: 0;
    		width: 61.6%
    	}
    
    	.wp-block-vk-blocks-staff .vk_staff_photo {
    	    order: 1;
    	    width: 32%;
    	    height: auto;
    	}
    	
    }

    上記をベースに色々調整してみてください。

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