0

在下面的代码中,左侧div块导航区域有填充,块顶部的固定(或绝对)位置div看起来像 1em,但左侧没有填充,而另一个div没有顶部或左侧的内容块上没有填充填充。至少在 Firefox 和 Chrome 中是这样。我怎样才能在position: absolute块上没有填充。注意:如果我删除position: absolute. 我该如何解决?我知道稍后我会想要填充,但我希望填充在导航和内容区域上看起来正确,并且我希望它们在没有填充作为基线的情况下看起来相同。

这是一张图片。看看左侧的 have 区域更厚,左侧的 content 区域如何变薄?

在此处输入图像描述

这是示例代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
    body {
    background: #fff;
    }
    div.content {
    background: #000;
    margin-left: 20em;
    margin-right: 4em;
    border-radius: 2em;
    }
    p {
    color: #fff;
    }
    div.nav {
    background: #000;
    width: 16em;
    position: absolute;
    left: 1em;
    top: 1em;
    border-radius: 2em
    }
</style>
</head>
<body>
<div class="content">
    <p>This is content area text</p>
</div>
<div class="nav">
    <p>This is a nav area text</p>
</div>
</body>
</html>
4

2 回答 2

-1

如果您要分配职位:绝对;到任何元素,然后不要应用边距属性。利用 top, left, right, bottom 属性。

于 2013-01-17T06:17:09.737 回答
-1

在这里找到答案http://www.webmasterworld.com/css/3083754.htm

它需要* {margin:0; padding:0}添加到开头,并且可以正常工作。

于 2013-01-17T07:21:06.260 回答