Зазор между "плавающими" div'ами

Vertachilo · July 19, 2011

Задача:

Сделать 2 "резиновых" дива с заданным цветом и родительским дивом.

Первый див прижат влево, второй вправо.

Проблема:

В opera, chrome, safari между дивами появляется зазор в 1 пиксель сразу или при масштабирование окна браузера по ширине.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="content-language" content="ru" />
<title>The table</title>
<style type="text/css">
html, body {
  margin:0px;
  padding:0px;
}
#div0 {
width:100%;
background-color:red;
height:12px;
}
#div1 {
width:75%;
float:left;
background-color:green;
height:12px;
}
#div2 {
width:25%;
float:right;
background-color:black;
height:12px;
}
</style>
</head>
<body>
<div id="div0">
<div id="div1"></div>
<div id="div2"></div>
</div>
</body>
</html>

Softlink · July 20, 2011

а если так?


<style type="text/css">
html, body {
  margin:0px;
  padding:0px;
}
#div0 {
background-color:red;
height:12px;
overflow:hidden;
}
#div1 {
margin-right:25%;
background-color:green;
height:12px;
}
#div2 {
width:25%;
float:right;
background-color:black;
height:12px;
}
</style>
</head>
<body>
<div id="div0">
	<div id="div2"></div>
	<div id="div1"></div>
</div>
</body>
</html>

Vertachilo · July 20, 2011

Респект! Я так долго мучался...

Плюсанул бы репу, но ещё "зелёный")))

Sign In

Зазор между "плавающими" div'ами

Question

Vertachilo

Link to comment

Share on other sites

2 answers to this question

Recommended Posts

Softlink

Link to comment

Share on other sites

Vertachilo

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information