まだhtmlとcssには新しいですが、ウェブサイトを作成したところすべてがうまく動作しますが、画面のサイズを小さくするとナビバーのロゴが飛びぬきます。 1300ピクセルから約1200ピクセルまで画面の左側にプッシュされます。 それから内側に飛びます。 そこから(1200px - 760px)それは再び左側にプッシュされ、再びジャンプします。 これは数回あります。画面のサイズを変更したときにロゴが飛び散る
760px未満ではすべて問題ありません。それはすべきだと思われ、何も飛びません。
ロゴを固定幅の左にして、ナビゲーションバーの左側に置いておきます。
説明が難しいですが、とにかく私を助けてくれることを願っています。
Htmlの
<body>
<a name="top"></a>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand smoothScroll animated" href="#top">
CSS
.navbar {
min-height: 150px;
border: none !important;
}
nav .navbar-toggle {
margin: 13px 15px 13px 0;
}
.navbar-brand {
background: url(../img/logo.png) no-repeat;
background-size: auto;
height: 110px;
width: 60px;
transition: width 1s;
margin-top: 18px;
margin-left: 50px;
}
.navbar-brand img {
width: auto;
height: 100%;
}
私はこれと同様の質問Logo Moves All Over The Place When Resize Windowsを見つけたが、それは私の場合は何も変わりません。 私はまた、メディアのクエリとmargin-left(pxと%)で作業しようとしましたが、何も助けにはならないと思われます。
私は実際にあなたの助けをここで使用することができます。どうもありがとうございます!
私はブートストラップを使用しています。
'navbar navbar-inverse navbar-fixed-top' - これはブートストラップサイトですか? – BSMP
はいブートストラップを使用しました。申し訳ありませんが、私はそれを試して – Jassi