Hello, I am having an issue where Opera and Safari are displaying extra white space on the right when I use percentages for my width. Below is my code snippet:
Safari 5.1 and 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;
}