2 дива по горизонтали

ros.pro · March 10, 2008

В общем, имеется небольшой глюк в ие: необходимо разместить 2 дива по горизонтали рядом, чтобы они занимали по 50% пространства, но чтобы между дивами был небольшой отступ размером в 2 пикселя.

Делаю так:

<style type=text/css>
.block_top{
padding-left: 10px;
height: 27px;
line-height: 30px;
overflow: hidden;
margin-bottom: 4px;
font-family: Arial;
font-weight: bold;
font-size: 11px;
color: #FFF;
background: url('images/block_top_fon.gif') repeat-x;
}
.block_content{
padding-left: 10px;
padding-top: 5px;
padding-bottom: 5px;
background: #f6f6f6;
overflow: hidden;
position: relative;
border: 1px solid #dddddd;
font-family: Arial;
font-weight: normal;
font-size: 11px;
color: #000;
}
.block_content_2{
padding-left: 10px;
padding-top: 5px;
padding-bottom: 5px;
float: left;
width: 50%;
margin-right: 2px;
background: #f6f6f6;
overflow: hidden;
position: relative;
border: 1px solid #dddddd;
font-family: Arial;
font-weight: normal;
font-size: 11px;
color: #000;
}
</style>
<div class="block_main">
 <div class="block_top">Последние новости</div>
 <div class="block_content_2">g</div>
 <div class="block_content">ga</div>
</div>

В опере и мозиле все работает нормально, а вот ие "съедает" 1 пиксель дива, который справа.

Storm · March 14, 2008

Так подойд?т?

<!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" lang="en">

<head>
<title>TITLE</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css">
/*<![CDATA[*/
body {margin:0;padding:0;}
#left {background:green;width:50%;float:left;border-right:1px solid white;}
#right {background:#00CC99;width:50%;float:right;margin-left:-50%;padding-left:1px;border-left:1px solid white;}
/*]]>*/
</style>
</head>
<body>
<div id="left">left</div>
<div id="right">right</div>
</body>
</html>

Sign In

2 дива по горизонтали

Question

ros.pro

Link to comment

Share on other sites

1 answer to this question

Recommended Posts

Storm

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information