[ 解決済 ] ヘッダーロゴ画像サイズ変更でスマホではみ出てしまう

VWSとは フォーラム Lightning [ 解決済 ] ヘッダーロゴ画像サイズ変更でスマホではみ出てしまう

[ 解決済 ] ヘッダーロゴ画像サイズ変更でスマホではみ出てしまう

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

    お世話になります。
    ご教示お願いいたします。
    WordPress 5.3.2 (Lightning Pro バージョン: 4.0.9)
    VK Blocks Proバージョン 0.23.5
    Lightning Skin JPNSTYLE バージョン 5.1.2
    ヘッダーロゴ画像が小さくて、追加cssに下記を記述して大きくしました

    .navbar-brand img {
    max-height: 70px;
    }

    PCでは、大きくなるのですが、
    スマホ、タブレット ではロゴがheader背景からはみ出てしまいます。

    収まるようにしたいのですが、ご指導お願いいたします。

    #35399

    DRILL LANCER
    モデレーター
    .navbar-brand img {
    	max-height: 70px;
    }

    を消して

    @media (min-width: 992px) {
    	.navbar-brand img {
    		max-height: 70px;
    	}
    }

    に書き換えたら上手くいくと思います。

    #35400

    DRILL LANCER 様

    ありがとうございます。m(_ _)m
    すいません、スマホの画像も一回り大きくするにはいかがしたら良いでしょうか?

    #35401

    Vektor,Inc
    キーマスター

    ↓ 下記など参照するとかんたんなカスタマイズは自分で対応できるようになると思いますので見てみてください。

    全てのWordPressテーマで使える!デザインをピンポイントで変更する方法 〜親テーマのCSSは書き換えないで〜

    #35402

    勉強いたします。
    m(_ _)m
    ありがとうございます。

    #35403

    Vektor,Inc
    キーマスター

    ↓ おそらく下記のような感じですが、JPNSTYLEだけスライドやページヘッダーが固定なのでちょっとむずかしいかもしれません。

    @media (max-width: 991.98px){
    	.siteHeader{
    		height:70px;
    	}
    	.navbar-brand {
    		padding:0 30px 0 30px;
    	}
    	.navbar-brand img {
       max-height:90px;
    		max-width:100%;
    		height:70px;
    		width:auto;
    }
    }
    #35410

    Vektor,Inc 様

    ありがとうございます。
    諦めかけて、おりました。
    助かります。

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