0

在我的基于 WordPress 的网站http://brilliantzenaudio.com上,导航菜单的右侧出现了一些文本。它应该在下一行。我尝试在几个不同的地方使用 display:block 属性,但没有运气。

header.php 的相关部分:

<body <?php body_class(); ?>>
   <div id="wrapper" class="hfeed">
      <header id="header" role="banner">
         <img src="<?php get_template_directory()?>/assets/img/brav-banner-3.jpg">
         <nav id="menu" role="navigation">
            <?php wp_nav_menu( array( 'theme_location' => 'main-menu' ) ); ?>
         </nav>
      </header>
   <div id="container">

front-page.php 是

<?php get_header(); ?>
<section id="content" role="main">
  <div id="info"
       <h4>In the Los Angeles area? </h4> <p>Ask about free demo loaners! </p>
       <h4>We also take mail orders.</h4> On all orders, there is a 30-day return policy!</p> 
  </div>
  <div id="longSlogan">
       <img class="frontpageimg" src="<?php get_template_directory(); ?>/assets/img/slogan-2.jpg">

  </div>
  <div id="bunchOfPictures">

       <img src = "<?php get_template_directory(); ?>/assets/img/cables-ers-absorber-700.jpg"/></a>
       <img src = "<?php get_template_directory(); ?>/assets/img/blueprint-silencers-v2-700.jpg"/></a>
       <img src = "<?php get_template_directory(); ?>/assets/img/brav-front-page-700.jpg"/></a>

        <a href="contact" class="btn btn-lg btn-orange">Contact Us</a>
   </div>
</section>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

style.css 的相关部分:

#header {
  margin-left: auto;
  margin-right: auto;
  width:90%;
}

body {
  background: #ffffff;
}

.content {
  margin: auto;
  width:90%;
  background: #ffffff;
}

#longSlogan {
  margin-left: 20px;
}

#menu {
  display:block;
  width: 900px;
  background: #222222;
}
4

2 回答 2

1

有几件事导致了这种情况:

  1. 你没有关闭一个 div 标签<div id="info"需要<div id="info">
  2. 你的导航菜单有浮动元素,没有 CSS 样式的overflow:hidden显示块什么都不做。

使您的菜单 css 与此匹配:

#navDiv{
   display: block;
   overflow: hidden;
}

如果您没有为下拉菜单使用绝对定位,隐藏菜单的溢出可能会产生一些负面影响。因此,作为替代方案,您可以清除从容器 div 开始的浮动:

#container{
    clear: both;
}

这将清除其上方元素的左右浮动。

于 2013-10-24T02:34:47.580 回答
0

在您的 front-page.php 中,您缺少 div 的右括号。

于 2013-10-24T02:29:50.780 回答