我试图让我的导航栏出现在我的内容和标题之间。当我更改 CSS 上的值时,它要么出现在屏幕顶部,在我的标题/内容后面,要么在标题/内容前面(如果我更改 z-index)我希望它出现在两个 div 之间但是如果我添加填充,例如它会影响下面内容的定位,目前似乎根本不会这样做。
干杯
标题.php
<!doctype html>
<html <?php language_attributes(); ?> class="no-js">
<head>
<meta charset="<?php bloginfo('charset'); ?>">
<title><?php wp_title(''); ?><?php if(wp_title('', false)) { echo ' :'; } ?> <?php
bloginfo('name'); ?></title>
<link href="//www.google-analytics.com" rel="dns-prefetch">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="<?php bloginfo('description'); ?>">
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<!-- wrapper -->
<div class="wrapper">
<!-- header -->
<header class="header clear" role="banner">
<!-- logo -->
<div class="headercenter">
<div class="logo">
<a href="<?php echo home_url(); ?>">
<!-- svg logo - toddmotto.com/mastering-svg-use-for-a-retina-
web-fallbacks-with-png-script -->
<img src="<?php echo get_template_directory_uri(); ?
>/img/logo.png" alt="Logo" class="logo-img"></a>
<!-- /logo -->
</div>
<div class="information">
<p class="t_header">Call Us</p>
<p class="b_text">01209 215671</p>
<p class="t_header">E-Mail Us</p>
<p class="b_text">secretary@pennoweth.cornwall.sch.uk</p>
<!-- /information -->
</div>
<!-- /headercenter -->
</div>
<!-- nav -->
<nav class="nav" role="navigation">
<?php html5blank_nav(); ?>
</nav>
<!-- /nav -->
</header>
<!-- /header -->
CSS
#nav{
width:100%;
height:50px;
position:relative;
left:0;
background:#555555;
}
最佳答案
根据所提供的信息(确实可以使用更多详细信息,最好是链接),听起来您可能已经为某个元素分配了绝对位置。绝对定位的元素将相对于具有 RELATIVE 位置的第一个父元素显示。
如果您删除“position: absolute”,它应该显示在 's 的流中。
只是关于两个元素如何占据同一个位置的有根据的猜测!
关于html - 在标题和内容之间定位导航栏?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25507018/