为什么我的WP网站在Firefox中被破坏了?

时间:2015-02-25 16:20:19

标签: wordpress firefox zurb-foundation

我正在为客户构建一个WordPress网站,目前该网站已在Firefox上破解。一切都显示出来,但在初始着陆时,只有标题可见,然后您必须滚动一页宽度才能看到网站的其余部分。我能够通过改变PHP文件中标题的位置来解决这个问题,但这会破坏Chrome上的移动功能和标题。请帮忙。

该链接是实时的,因此您可以在hogarcotui.org查看问题,这里是HTML和PHP头文件

<?php wp_head(); ?>
</head>

<body <?php body_class(); ?>>
  <?php do_action( 'foundationPress_after_body'); ?>



  <div class="small-12 xlarge-12 columns">
    <div class="medium-2 large-2 xlarge-2 columns show-for-medium-up">
      <a href="http://www.en.hogarcotui.org">
        <img class="logo" src="../wp-content/uploads/2015/01/logo.png">
      </a>
    </div>

    <div class="small-3 columns show-for-small-only invisible">...</div>
    <div class="small-6 columns end show-for-small-only">
      <a href="http://www.en.hogarcotui.org">
        <img class="logo" src="../wp-content/uploads/2015/01/logo.png">
      </a>
    </div>


    <div class="medium-8 large-9 xlarge-9 columns show-for-medium-up">
      <h1 class="name">Hogar de Ancianos en Cotuí RD</h1>

    </div>
    <div class="small-2 small-offset-6 medium-2 medium-offset-8 large-2 large-offset-10 xlarge-2 xlarge-offset-10 columns language">
      <a href="http://www.hogarcotui.org" id="langLink">Spanish</a>
    </div>
  </div>

  <div class="off-canvas-wrap" data-offcanvas>
    <div class="inner-wrap">

      <?php do_action( 'foundationPress_layout_start'); ?>



      <nav class="tab-bar show-for-small-only">
        <section class="left-small">
          <a class="left-off-canvas-toggle menu-icon" href="#"><span></span></a>
        </section>
        <section class="middle tab-bar-section">

          <h1>Hogar Cotui RD</h1>

        </section>
      </nav>

      <?php get_template_part( 'parts/off-canvas-menu'); ?>

      <?php get_template_part( 'parts/top-bar'); ?>

      <section class="container" role="document">
        <?php do_action( 'foundationPress_after_header'); ?>

2 个答案:

答案 0 :(得分:0)

检查两次插入标题的源代码。你看到两次:

<html class="no-js" lang="en-US" >
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />

        <link rel="stylesheet" href="http://www.hogarcotui.org/wp-content/themes/FoundationPress/css/foundation.css" />
        <link rel="stylesheet" href="http://www.hogarcotui.org/wp-content/themes/FoundationPress/css/style.css" />

您必须更正html结构。我需要标题,页面和页脚代码来完全理解问题所在。

答案 1 :(得分:0)

这里没有双头... 我建议您在样式表中进行以下更改。

  1. overflow:hidden移除.off-canvas-wrap。 这会将内容定位在标题下方。

  2. float:left添加到.top-bar-container, .tab-bar。 这将设置菜单背景。

  3. overflow-x:hidden添加到body。 这将删除水平滚动。

  4. GL!