wordpress 将内容调整为管理栏高度（管理栏细而粗）答案

【问题标题】：wordpress adjust content to admin-bar height (thin and thicker admin bars)wordpress 将内容调整为管理栏高度（管理栏细而粗）
【发布时间】：2014-01-27 15:26:51
【问题描述】：

我正在尝试开发我的第一个 wordpress 主题。我有一个带有徽标图标和菜单按钮的固定侧栏（也可能有社交媒体图标）。

当用户未登录 wordpress 时，屏幕顶部没有管理栏，所以我将侧栏设置为：

#masthead{
    position: fixed;
    top: 0;
    left: 0;
    width: 40px;
    height: 100%;
    background-color: rgba(0,0,0,0.2);
    z-index: 999;
}

当用户登录时，屏幕顶部会出现一个管理栏。当 admin-bar 出现时，body 标签有一个附加类：admin-bar，所以我正在改变我的侧边栏：

.admin-bar #masthead{
    top: 32px;
}

问题是，当我调整窗口大小时，它会达到管理栏变粗的大小（46 像素）。有没有办法“看到”与css的这种差异？我想我可以使用媒体查询来做到这一点，但如果它可以与更薄条的解决方案一起使用，我想我会更开心。

有什么想法吗？谢谢！

【问题讨论】：

你可以使用开发者工具（按F12），最好是创建一个demo
对不起，我不明白你的意思... =/

标签： html css wordpress

【解决方案1】：

您需要执行一些媒体查询来根据管理栏调整 CSS 的大小。

例如：

@media all and (max-width: 699px) {
.admin-bar #masthead{ top: 46px; }
}

http://css-tricks.com/css-media-queries/

【讨论】：