浮法右元素比其他元素

我有这样的问题，即我的float: right元素确实是浮动权呈现较高，但它上面的其他元素，有时甚至去离屏幕浮法右元素比其他元素

我的CSS：

html, body { 
    width: 100%; 
    height: 100%; 
    padding: 0; 
    margin: 0; 
} 
header { 
    background-color: black; 
} 
#header-limiter * { 
    display: inline-block; 
    color: white; 
} 
header span { 
    font-weight: 700; 
    font-size: 18px; 

} 
#header-limiter { 
    padding: 10px; 
    width: 100%; 
    display: block; 
} 
#logoText { 
    font-size: 16px; 
} 
#logout-btn { 
    float: right; 
}

的jsfiddle ：http://jsfiddle.net/wLftd9ph/3/

来源

2015-12-06 Deimantas

你退出文本不具有相同的默认余量为p文本（logoText）。

只需将margin: 1em 0添加到#logout-btn即可。

http://jsfiddle.net/wLftd9ph/5/

来源

2015-12-06 16:44:27

的作品感谢 – Deimantas

关于这个网站，你觉得有用的答案，[考虑的给予好评]（http://stackoverflow.com/help/someone-answers）。没有义务。只是提高质量内容的一种方式。 –

一个快速的方法来解决定位是使用display: inline-block与vertical-align: middle而不是浮动，你可以在此看到小提琴http://jsfiddle.net/exmubg5m/

#logout-btn { 
    display: inline-block; 
    vertical-align: middle; 
} 
textarea { 
    display: inline-block; 
    vertical-align: middle; 
}

来源

2015-12-06 16:33:38 Zoheiry

添加标志文字。

float: left; 
z-index: 0;

同时删除从LOGO“文”的<p>标签，因为这增加了一个新的段落。

<span>LogoText</span>

来源

2015-12-06 16:40:34 Jack

浮法右元素比其他元素

回答

相关问题