0

嗨，当我在宽度中使用百分比时，有人可以知道为什么opera并safari有额外的空白。right下面是我的代码：

safari 5.1和opera 11.11

小提琴

html:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>
  <title>sample</title>

  <link rel="stylesheet" type="text/css" href="style.css" />

</head>

<body>

    <div class="wrap">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>

</body>
</html>

CSS：

    html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td, img  {
  margin: 0; padding: 0
}

/* remember to define focus styles! */
:focus {
    outline: 0;
}

body {
  font-family: arial, sans-serif;
  font-size:13px;
  color:#fff;
  background-color:#000;

}

a {color:#444; text-decoration:none;}

ul li {list-style-type:none;}

p {padding:0 0 1.5em 0; line-height:1.7em; float:left;}

img {border:none}


.wrap {
    float:left;
    width:100%;
}
.wrap div{
    float:left;
    width:25%;
    height:100px;
    background-color:#222;
}

在此处输入图像描述

4

2 回答 2

0

凉爽的！似乎 Safari 的计算非常错误。如果您调整框架的大小，您有时会看到它适合。不知道发生了什么。但是，可能的解决方法是display: table：

.wrap {
    width:100%;
    display: table;
}

.wrap div{
    width:25%;
    height:100px;
    background-color:#222;
    display: table-cell;
}

这是一个演示。

在你的情况下这可能是不可能的，不知道。但它解决了错误的计算问题。

于 2013-04-25T04:49:00.580 回答
0

尝试添加这个 CSS：

body {
   margin: 0px;
   padding: 0px;
}
于 2013-04-25T04:05:42.620 回答