Question

我在我的网站上使用了2种语言：阿拉伯语/英语

英文版：一切正常。

我只在仅在Chrome上打开网站时遇到阿拉伯语版本的问题，如果您可以在线查看（阿拉伯语）：

你会看到标题上方的上边距，我正在尝试删除它，但我不知道它来自哪里，但它已成功从英文版中删除

它将从.header-wrapper类开始。

HTML代码：

<div class="header-wrapper">
    <div id="welcome">
          <form action="http://staging.wain.com.kw/index.php?route=module/language" method="post" id="language_form" enctype="multipart/form-data">
  <div id="language">

 <a title="English" onclick="$('input[name=\'language_code\']').attr('value', 'en'); $('#language_form').submit();">
   English
 </a>



    <input type="hidden" name="language_code" value="">
    <input type="hidden" name="redirect" value="http://staging.wain.com.kw/index.php?route=common/home">
  </div>
</form>
                            <span>مرحبا بالزائر يمكنك</span><a href="http://staging.wain.com.kw/index.php?route=account/login">تسجيل الدخول</a><b>أو</b><a href="http://staging.wain.com.kw/index.php?route=account/register">تسجيل جديد</a>                
          <div class="links">
          حسابي       <ul>
          <li><a href="http://staging.wain.com.kw/index.php?route=account/account">حسابي</a></li>
          <li><a href="http://staging.wain.com.kw/index.php?route=checkout/cart">سلة الشراء</a></li>
          <li><a href="http://staging.wain.com.kw/index.php?route=onecheckout/checkout">إكمال الطلب</a></li>
          </ul>
          </div>
          <a href="index.php?route=product/compare" id="comparelist">قائمة المقارنة</a>
          <a href="http://staging.wain.com.kw/index.php?route=account/wishlist" id="wishlist-total">قائمة رغباتي (0)</a>

    </div>
    <div id="header" class="sunset">

                <div id="menu">
        <span>Menu</span>
          <ul>
          <li class="home"><a title="الرئيسية" href="http://staging.wain.com.kw/index.php?route=common/home"><span><i class="icon-home"></i></span></a></li>
                        <li><a href="http://staging.wain.com.kw/index.php?route=product/category&amp;path=70">أكواب</a>
                        </li>
                        <li><a href="http://staging.wain.com.kw/index.php?route=product/category&amp;path=67">الإكسسوارات</a>
                        </li>
                        <li><a href="http://staging.wain.com.kw/index.php?route=product/category&amp;path=68">بوستر</a>
                        </li>
                        <li><a href="http://staging.wain.com.kw/index.php?route=product/category&amp;path=74">سماعات</a>
                        </li>
                        <li><a href="http://staging.wain.com.kw/index.php?route=product/category&amp;path=73">ملابس</a>
                          <div>
                                <ul>
                                                                  <li><a href="http://staging.wain.com.kw/index.php?route=product/category&amp;path=73_64">تي شيرت (19)</a></li>
                                                                  <li><a href="http://staging.wain.com.kw/index.php?route=product/category&amp;path=73_66">طويلة الأكمام (2)</a></li>
                                                                  <li><a href="http://staging.wain.com.kw/index.php?route=product/category&amp;path=73_71">قبعات (2)</a></li>
                                                                  <li><a href="http://staging.wain.com.kw/index.php?route=product/category&amp;path=73_65">هودي (3)</a></li>
                                                </ul>
                              </div>
                        </li>
                        <li><a href="http://staging.wain.com.kw/index.php?route=product/category&amp;path=69">ملصقات</a>
                        </li>
                      </ul>
        </div>



                 <div id="logo"><a href="http://staging.wain.com.kw/index.php?route=common/home"><img src="http://staging.wain.com.kw/image/data/logo2.png" title="WAIN" alt="WAIN"></a></div>

        <div id="cart">
  <div class="heading">
    <h4><i class="icon-shopping-cart"></i><!--سلة الشراء--></h4>
        <a><span id="cart-total">سلة الشراء فارغة!</span></a></div>
      <div class="content">
        <div class="empty">سلة الشراء فارغة!</div>
      </div>
</div>  </div>
</div>

CSS代码：

.header-wrapper {
max-width: 1200px;
margin: 0px auto 0px;
}

谢谢。

Answer 1

在<body>标记后，有很多空白区域。删除它，空间消失。

通常建议尽可能保持标记清洁，以避免将来出现像这样的问题。

Answer 2

<body> 




<meta charset="UTF-8">

在body标记之后，有一个空格。您需要删除该空格以避免边距顶部。

enter image description here

Chrome无法识别的顶部空间

2 个答案: