我无法获得与我网站其余部分相关的div位置

时间:2010-02-24 18:59:24

标签: css

我表达了一些奇怪的东西。问题很简单,但我的css知道如何停在这里。

在黑暗部分,带有文字的中间部分与网站的其他部分无关。我知道这与其他div相关的div有关。我尝试过这个,但它不起作用。

http://www.coldcharlie.nl/test2/

这是圆角部分的css部分,奇怪的是我可以将阴影部分放在圆角容器中,阴影与圆角部分相关。

我也尝试将上面的css放在另一个容器中,但这并没有起作用并破坏了网站。

有人可以告诉我该怎么做吗?

.rounded_corners{

background: url(../images/achtergrond_homepage.png); no-repeat left bottom;
display: block;
left: 480px;
top: -730px;
z-index: 100000;
position: relative;
color:#FFF;
padding: 15px;
width: 360px;
height: 440px;

}

<div class="rounded_corners">
        <div><h1> <br />Computerhulp in Friesland </h1>
  </div>
  <p>Is  uw computer stuk? Of werkt uw laptop traag? Met de computerhulp van  Friese Computerservice werkt uw computer of laptop weer snel als  vanouds. <br />
    Friese Computerservice is gevestigd in Leeuwarden, maar is actief in heel Friesland.</p>
  <h2><strong>Goede computerhulp is belangrijk!</strong></h2>
  <p>Een computer of laptop gaat altijd stuk op het moment dat het u niet  uitkomt. Vervelend! Vaak wordt geprobeerd om de storing zelf te  verhelpen. Helaas…. met alle gevolgen dien! Uw computer of laptop is  helemaal niet meer bruikbaar of belangrijke informatie (denk ook aan uw  foto’s!) zijn onvindbaar. Het is dan ook raadzaam om voor reparaties  altijd naar een gespecialiseerd computer reparatiebedrijf te gaan.</p>
  <h2><strong>Ook computerhulp nodig?</strong></h2>
  <p>U wilt weer vertrouwd én snel met uw computer of laptop werken? Neem  dan contact op met Friese Computerservice. Onze kennis is uitstekend,  onze tarieven scherp. Bel of mail ons. Wij helpen u graag!</p>
<div id="shadow"><!--This is the shadow part--></div>
       </div>

1 个答案:

答案 0 :(得分:1)

你有id="wrap-header"的div使用margin: 0 auto ...这意味着它将水平居中。它还有position: relative以及position: absolute内的很多内容。这意味着wrap-header中的内容根据wrap-header的位置定位,并且wrap-header 的位置会因为居中而调整窗口大小

但是你的带有文字的黑匣子,带有id=rounded-corners的div超出了所有这些东西,所以它的位置不随窗口大小而变化。因此,几乎每个窗口的尺寸都会出错。

要么在wrap-header上删除margin:0 auto,要么将更多内容从wrap-header中移出(对于很多内容来说,它没有意义,也许你放错了地方关闭div标签?)或将圆角移动到内部wrap-header,以便与其余部分重新定位。