Question

我似乎无法让我的margin-top:0;属性在我的样式表中工作。我不知道为什么，但是当我清除浏览器的缓存时，该属性将暂时起作用，然后回到我的页面顶部留一个空格（看看：www.sunporchhomes.com）。我正在使用Wordpress来构建。这是我的代码的上半部分，非常感谢任何帮助。

CSS

body
{
margin:0;
padding:0;
background-image:url("http://www.sunporchhomes.com/sphbg5.png");
}

a:link {color:#ffffff;}      /* unvisited link */
a:visited {color:#ffffff;}  /* visited link */
a:hover {color:#808080;}  /* mouse over link */
a:active {color:#ffffff;}  /* selected link */

a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:none;}
a:active {text-decoration:none;}

#logo {
    margin: 0;
    width: 1000px;
    z-index: 26;
}

.wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -50px; /* the bottom margin is the negative value of the footer's height */
}

#header {
    width: 1000px;
    height: 175;
    position: absolute;
    top: 0;
    left: 0;
    padding-left:70px;
}

#banner {
            position: absolute;
            top: 0px;
            left: 0px;
            right: 0px;
            width: 100%;
            height: 419px;
            z-index: -1;
        }

#navigationtable {
    position:absolute;
    padding-left:730px;
    z-index: 10;
    padding-top:20px;
}

HTML

<body>

<div id="wrapper" class="hfeed">

   <img id="banner" src="http://sunporchhomes.com/spmain1.png" alt="Banner Image"/>

       <div id="navigationtable">
<table class="tg" width="400">
  <tr>
    <th class="tg-lhfu"><a href="http://sunporchomes.com">HOME</a></th>
    <th class="tg-031e"></th>
    <th class="tg-031e"><a href="http://sunporchhomes.com/warranty.html">WARRANTY</a></th>
    <th class="tg-031e"></th>
  </tr>
 <tr>
    <th class="tg-lhfu"><a href="http://sunporchhomes.com/features-3.html">FEATURES</a></th>
    <th class="tg-031e"></th>
    <th class="tg-031e"><a href="http://sunporchhomes.com/faq-2.html">ROWHOME FAQ</a></th>
    <th class="tg-031e"></th>
  </tr>
 <tr>
    <th class="tg-lhfu"><a href="http://sunporchhomes.com/floor-plan-2.html">FLOORPLAN</th>
    <th class="tg-031e"></th>
    <th class="tg-031e"><a href="http://sunporchhomes.com/about.html">ABOUT US</a></th>
    <th class="tg-031e"></th>
  </tr>
 <tr>
    <th class="tg-lhfu"><a href="http://sunporchhomes.com/neighbourhood.html">NEIGHBOURHOOD</a></th>
    <th class="tg-031e"></th>
    <th class="tg-031e"><a href="http://sunporchhomes.com/contact.html">CONTACT</a></th>
    <th class="tg-031e"></th>
  </tr>

</table>
</div>

 <div id="boxplus">
 <img src="http://sunporchhomes.com/boxplus.png" />
 </div>

 <div id="logo">   
    <img src="http://sunporchhomes.com/splogo13.png" /> 

    </div>
 </div>

Answer 1

您遇到的问题不是您的问题，而是您的WordPress管理栏。

当您登录WordPress时，它会强行尝试＆＃34;在浏览器窗口的前32个像素上绘制一个管理栏。

如果你的CSS与WP试图这样做有什么冲突（我认为你的css ，由于你大量使用position: absolute），你可能会留下一个空白在顶部而不是管理栏。

您可以通过修改用户个人资料来禁用管理栏，并在查看网站时取消选中＆＃34;显示工具栏＆＃34;

我已经在Firefox，Chrome和Internet Explorer中进行了测试 - 它们都可以正常渲染您的网站，而不会占用您描述的空间。

Topmargin 0不工作？缓存问题？

1 个答案: