Как да направя това ?

SouthwinD

Registered
Хора здравейте бихте ли ми казали как данаправя това, което съм направил на снимката ? .css кодовете моля ви се http://store.picbg.net/pubpic/7C/3F/b88f5546c3d77c3f.png
 
SouthwinD каза:
Хора здравейте бихте ли ми казали как данаправя това, което съм направил на снимката ? .css кодовете моля ви се http://store.picbg.net/pubpic/7C/3F/b88f5546c3d77c3f.png
Тва в червеното ли ?
 
Ми тва в червеното:

Правиш един <div> и в него слагаш още един <div> със същата дължина но с по малка височина
 
Ето ти примерен темплейт. Как би изглеждал кода и самия сайт без картинките. Мисля, че ще се оправиш от тук нататък.
Код:
<!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>
<title> примерен темплейт </title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<style type="text/css">
		#container {
			width: 610px;
			margin: 0 auto;
		}
		
		#leftcolumn {
			width: 190px;
			float: left;
			margin-right: 10px;
		}
		
		#rightcolumn {
			width: 400px;
			float: right;
		}
		
		#header {
			width: 610px;
			height: 150px;
			border: 1px solid black;
			background-color: gray;
			margin-bottom: 10px;
		}
		
		.top {
			width: 190px;
			height: 30px;
			background-color: red;
		}
		
		.content {
			width: 190px;
			background-color: green;
		}
		
		.topbig {
			width: 400px;
			height: 30px;
			background-color: red;
		}
		
		.contentbig {
			width: 400px;
			background-color: green;
		}
		
		#footer {
			width: 610px;
			height: 30px;
			background-color: yellow;
			position: absolute;
			bottom:0;
		}
	</style>
</head>

<body>
	<div id="container"> 
		<div id="header"></div>
		<div id="leftcolumn">
			<div class="top">Lorem Ipsum</div>
			<div class="content">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500.</div>
		</div>
		<div id="rightcolumn">
			<div class="topbig">Lorem Ipsum</div>
			<div class="contentbig">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500.</div>
		</div>
	<div style="clear: both;"></div>
		<div id="footer"></div>
	</div>
</body>
</html>
 
братле не съм го проверявал току що го пиша .. това ти е CSS
.kutiq
{
padding:none;
border:none;
width:800px;
height:auto;
}

.tab1
{
background:gray;
width:150px;
height:200px;
border:1px solid black;
float:left;
}

.tab1 ul
{

padding:0px;
background:black;
width:150px;
height:50px;
border-bottom:white solid 1px;
}

.tab2
{
margin-left:180px;
background-color:gray;
width:600px;
height:auto;
border:black 1px solid;

}
.tab2 ul
{
float:left;
width:560px;
height:50px;
background:black;
border-bottom:white solid 1px;
}

.tab3
{
margin-top:50px;
background:black;
border:black 1px solid;
width:800px;
height:50px;
}



A това html-a


<html>
<head>
<link rel=stylesheet type="text/css" href="new.css">
</head>
<body>
<div class="kutiq">
<div class="tab1">
<ul>xa
</ul></div>
<div class="tab2"><ul></ul>
hxahhh<br>xhahax<br>xhahxa<p>xhahxa<p>xhaha</div>
<div class="tab3">
xa
 

Back
Горе