|
|
|
| хелп..
нужно сделать следующее:
блок1 - блок 2 - блок 3,
всё это горизонтально в одном диве.
<div class="head">
<div class="r">
<div class="left">
<a href="index.php"><img src="img/head_logo.gif" alt="description"></a>
</div>
<div class="content">
<div class="pad">
head
</div>
</div>
<div class="right">
right
</div>
</div>
</div>
|
.head {background:url(../img/head.gif) center repeat-x;margin:0 8;}
.head .left{float:left; width:110px;}
.head .right{ float:right;background:#000;}
.head .content{text-align:center;height:68px;}
.head .content .pad{padding-top:20px;}
.head .r { background:url(../img/head_right.gif) no-repeat right;}
|
так получается положить горизонтально только left и content, right же падает вниз.. как я только не пробовал рр..
заранее спасибо ;) | |
|
|
|
|
|
|
|
для: sl1p
(19.11.2008 в 12:09)
| | ^ | |
|
|
|
|
|
|
|
для: sl1p
(20.11.2008 в 09:32)
| | Тебе вот так надо?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
* { margin:0; padding:0; }
html, body { height:100%; }
.left { float:left; width:150px; position:relative; background:#00FF00; }
.content { float:left; width:100%; margin-right:-200px; margin-left:-150px; }
.pad { margin:0 200px 0 150px; background:#FFFF66; }
.right { float:left; width:200px; background-color:#6699CC; }
</style>
</head>
<body>
<div class="left">
rgjtyjn<br />
trhrtjnty<br />
rynmry<br />
</div>
<div class="content">
<div class="pad">
123<br />
457574
</div>
</div>
<div class="right">
kjfdhg<br />
ghkmth<br />
rgnr
</div>
</body>
</html>
|
| |
|
|
|
|
|
|
|
для: Madman
(20.11.2008 в 12:54)
| | оно, но всё нижнее под этим хидером подымается вверх.. тобишь не учитывает этот хидер:) | |
|
|
|
|
|
|
|
для: sl1p
(20.11.2008 в 13:13)
| | т.е.? Надо, чтобы его высота не учитывалась? Так помести все это дело в абсолютный блок с шириной 100%
Или я не привильно понял?! | |
|
|
|
|
|
|
|
для: Madman
(20.11.2008 в 13:28)
| | а всё спасибо:)
я забыл про clear:both..
нет просто все нижние залезли под хидер изза флоата.. | |
|
|
|
|
|
|
|
для: sl1p
(20.11.2008 в 13:35)
| | =)
Ну я как бы и пологал, что это самостоятельно допишешь!
НП | |
|
|
|
|
|
|
|
для: sl1p
(20.11.2008 в 13:35)
| | правда твой вариант немного не подошёл) ибо там картинки и немного не стыковалось...
получилось вот так :
.clear{clear:both;}
.head {background:url(../img/head.gif) center repeat-x; margin:0 8; height:68px;}
.head .left{float:left; width:110px;}
.head .right{float:left;background:url(../img/head_right.gif) no-repeat right; width:110px; height:68px;}
.head .content{text-align:center;height:68px; float:left; width:100%; margin:0px -110px;}
.head .content .pad{padding-top:20px;}
|
<div class="head">
<div class="left">
<a href="index.php"><img src="img/head_logo.gif" alt="description" align="top"></a>
</div>
<div class="content">
<div class="pad">
headddddddddddddddddddddddddddddd
</div>
</div>
<div class="right">
right
</div>
</div>
<div class="clear"></div>
|
| |
|
|
|