个人中心
文章发布
退出
作者热门文章
- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时，我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
26
4
在此JSFiddle ，为什么 nav#nav-header-menu 从屏幕顶部开始？
在 HTML 中，它在 div#header-right 之后开始。
我问的原因是我想向上移动 nav#nav-header-menu (margin-top: -2em;) 以便 Logo 位于在两个水平边框之间，像这样:
JSFiddle 在较宽的 HTML 窗口宽度下效果最佳。
HTML:
<body>
<div class="site-container">
<header class="site-header" itemscope="" itemtype="http://schema.org/WPHeader">
<div class="wrap">
<div class="container">
<div id="header-left">
<p><a href="mailto:contact@vmpersonal.com" title="Email Us"><img src="http://vmpersonal.com/wp-content/themes/genesis-sample/images/email.png" alt="Email Us" title="Email Us"></a> <a href="mailto:contact@vmpersonal.com" title="Email Us">contact@vmpersonal.com</a> </p>
</div>
<div id="header-right">
<p><span id="social"><a href="#" title="Watch us on YouTube"><img src="http://vmpersonal.com/wp-content/themes/genesis-sample/images/youtube.png" alt="Watch us on YouTube" title="Watch us on YouTube"></a> <a href="#" title="Follow us on Facebook"><img src="http://vmpersonal.com/wp-content/themes/genesis-sample/images/facebook.png" alt="Follow us on Facebook" title="Follow us on Facebook"></a> <a href="#" title="Follow us on Instagram"><img src="http://vmpersonal.com/wp-content/themes/genesis-sample/images/insta.png" alt="Follow us on Instagram" title="Follow us on Instagram"></a></span> <span id="user"><a ref="http://vmpersonal.com/wp-login.php" title="Sign In to VM Personal">Sign In</a> / <a href="http://vmpersonal.com/wp-login.php?action=register" title="Register for an account on VM Personal">Register</a></span></p>
</div>
<nav id="nav-header-menu">
<div class="menu-header-menu-container">
<ul id="menu-header-menu" class="genesis-nav-menu"><li id="menu-item-104" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-11 current_page_item menu-item-104"><a href="http://vmpersonal.com/" itemprop="url">Home</a></li>
<li id="menu-item-109" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-109"><a href="/shop" itemprop="url">Products & Services</a></li>
<li id="menu-item-105" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-105"><a href="http://vmpersonal.com/blog/" itemprop="url">Blog</a></li>
<li id="menu-item-110" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-110" style="display: none;"><a href="/" itemprop="url">Logo</a></li><img src="http://vmpersonal.com/wp-content/themes/genesis-sample/images/logo.png" width="124px">
<li id="menu-item-106" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-106"><a href="http://vmpersonal.com/success-stories/" itemprop="url">Success Stories</a></li>
<li id="menu-item-107" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-107"><a href="http://vmpersonal.com/about/" itemprop="url">About</a></li>
<li id="menu-item-108" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-108"><a href="http://vmpersonal.com/contact/" itemprop="url">Contact</a></li>
</ul>
</div>
</nav>
</div>
</div>
</header>
</div>
</body>
CSS:
<link rel="stylesheet" type="text/css" href="https://vmpersonal.com/wp-content/themes/genesis/style.css">
<link rel="stylesheet" type="text/css" href="https://vmpersonal.com/wp-content/themes/genesis-sample/mhm-style.css">
感谢帮助。
最佳答案
这是因为 div#header-right 设置了一个 float 属性。当某物 float 时，它会脱离 HTML 的正常静态渲染上下文，HTML 会一个接一个地渲染元素。查看Layouts with float and clear这里。
您可以尝试将 Logo 从 nav 容器中取出并制作 header-left、header-right 和您的 Logo 都在同一个容器中。这是总体思路……您怎么看？
<header class='container'>
<div class='header-left'></div>
<!-- put your logo here -->
<div class='header-right'></div>
</header>
<nav class='container'>
<div class='nav-items-left'></div>
<div class='nav-spacer'></div>
<div class='nav-items-right></div>
</nav>
header {
max-height: /* desired height */;
overflow: visible;
}
.header-left,
.header-right,
.your-logo,
.nav-items-left,
.nav-items-right,
.nav-spacer {
display: inline-block;
vertical-align: top;
}
.nav-spacer {
width: /* same width as your logo */;
}
.your-logo {
width: /* width of your logo */;
}
关于css - HTML/CSS : Start of DIV at an odd position，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42433516/
26
4
0
query("SELECT id, look, username, motto FROM users WHERE rank = '7'"); if($query->num_rows > 0):
这个问题在这里已经有了答案: Why does integer division yield a float instead of another integer? (4 个答案) 关闭 1 年前。
面试中被问到的问题: 给定一个数组。任务是排列数组: 奇数元素占据奇数位置，偶数元素占据偶数位置。 - 元素的顺序必须保持不变。 考虑从零开始的索引。 按条件打印后，若有剩余，则原样打印剩余元素。 例
首先，抱歉英语不是我的第一语言。 *(偶数和奇数是根据索引) 我想在移动 View 中实现此表。 我尝试过的 Content 1 Head Content 2
我有一个包含多行的表格 - 我为每一行分配了一个悬停功能。如果所选的 TR 是奇数还是偶数，我想在悬停函数中找出什么。 我使用了这段代码: alert(tr.is(":odd")); 不幸的是，它不起
我有一个奇怪的。我无法使用以下内容创建表: 数据库中已经存在表Users，只需添加UserTimeZones，但会失败。 CREATE TABLE `Users` ( `AccessFailed
我们在类里面学习数组，我被分配了这个编程项目。到目前为止，我已经编写了下面的代码，但我对如何让它正常工作感到困惑。我应该为我的代码使用带有 System.out.println 语句的 for 循环。
但是，如果 67 在原始数组中出现两次，它也需要在新数组中出现两次。 我试图解决this coding challenge通过创建频率图，然后将具有偶数值的键插入最终数组: function oddO
在我的 C++ 中学习复制构造函数等的使用。我们得到了一个我们要完成的程序模板，但是我的输出在我的输出流中抛出了时髦的 asci 字符。 这是我的主要类(class): #include using
我的主要问题是设置 JFrame 时的以下代码: public Frame(){ JPanel panel = new JPanel(); add(panel); panel.setPre
我正在开发一个 iOS 应用程序，我的 AVQueuePlayer 导致了问题。播放时出现此错误: RTCReporting: resolve from https://qtpartners.appl
我正在开发一个 3 选项卡的 iPhone 应用程序，我希望每个选项卡的 View 看起来共享相同的 map 。所以目前，我只是想弄清楚当单击新选项卡时如何重置每个 View 的 MKMapView
我正在尝试将文本渲染为非矩形的形状。以下代码在添加矩形路径时有效，但在添加椭圆路径时无效。最终，我想绘制任何路径(L 形等)，有人对此有运气吗？ -(void)drawRect:(CGRect)rec
这个问题在这里已经有了答案: Can I combine :nth-child() or :nth-of-type() with an arbitrary selector? (8 个答案) 关闭
鉴于我只想选择频率，我正在尝试计算逆 FFT。以下是我进行 FFT 的方法: final double[] points = reader.readPoints(); final DoubleFFT_
我是 scheme 的初学者，有人可以给我一些关于如何获取“列表中奇数位置的元素”的想法吗？所以 ( A B C D G ) 返回 ( G C A)。我得到了相反的列表，我现在需要拉出所有其他数字。请
我试图让底部图表的宽度与月份的长度成正比。 但是，我最终得到了 我有 2 层图表，第 1 层有一个更大的图，占据了一整行，另一个有 12 个图，占据了整个第二行。 对于第二行图，我希望它们的宽度与月份
我对递归概念有一点困难。 给定一个具有整数值的 LinkedList L1 = (2->1->4->6->3) L2= (1->9->6->3) 该函数应从整数 N 开始的链表中删除奇数，并返回对新
我有一个动态生成的 div 列表，并且我有这个脚本来制作交替背景颜色 - 为了 IE。 .box { height:30px; width:100px; background-color:#fff;
我有一个 DoubleEditor，它是根据从网上获取的 Integer Editor 进行修改的。我使用它来验证在 JXTable 单元格中输入的 double 值，该值旨在获取 0.00 到 10
我是一名优秀的程序员,十分优秀！