事業部和浮動

當Button元素的碰撞，我有以下代碼事業部和浮動

<div class="site-branding"> 
    <h1 class="site-title"><a href="http://localhost/Test/"  rel="home">Test</a></h1> 
</div> 

<button class="menu-toggle" aria-controls="primary-navigation" aria-expanded="false">Navigation</button>

在我的CSS，我把網站的品牌漂浮離開，然後菜單切換浮動權。在正常分辨率下，顯示效果很好。品牌位於標題的左側，菜單切換位於右側，但當屏幕變小時，我希望菜單切換按鈕位於網站品牌廣告的下方，但我得到的行爲是菜單-toggle與網站品牌的div碰撞。任何想法如何解決這個問題？謝謝。

來源

2015-09-21 django1001

在問題中彈出您的CSS。 –

下面是一個例子，如果你飄起這些元素有哪些呢發生的情況：

.headline { 
 
    float: right; 
 
} 
 
.btn { 
 
    float: left; 
 
}

<div> 
 
    <h1 class="headline">Some link to your homepage</h1> 
 
</div> 
 
<button class="btn">some button</button>

（按全屏和調整您的瀏覽器窗口）
按鈕元件浮標題下方。

現在你可以添加按鈕和網站標題的CSS類嗎？

來源

2015-09-21 08:21:56 Persijn

如果按以下方式重寫，您將會得到滿意的答案。您只需調整div的寬度即可。

的CSS

.FloatClass {浮動：左;}

的Html

<div class="FloatClass"> 
     <h1 class="headline">Some link to your homepage</h1> 
    </div> 
<div class="FloatClass"> 
    <button class="btn">some button</button> 
</div>

所有最優秀的

來源

2015-09-21 08:25:27

浮動會忽略元素的碰撞盒。當屏幕太小時，您將不得不使用媒體查詢將新的CSS應用到標題。例如，如果您的品牌寬度爲300像素，而您的切換寬度爲60像素，則應使用媒體查詢max-width: 360px，定位另一個CSS文件，該文件將切換到您的品牌形象下方。

來源

2015-09-21 08:26:40

事業部和浮動

回答

相關問題