html:
Kod: Zaznacz cały
<?xml version="1.0" encoding="iso-8859-2"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl">
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-2" />
<link rel="stylesheet" href="css/style.css" type="text/css" media="all"/>
<title>Tytuł</title>
</head>
<body>
<div id="content">
<div id="top">
NAGŁÓWEK
</div>
<div id="left">
<ul>
<li><a href="http://www.strona.pl">RM.PL</a></li>
<li><a href="http://www.strona.pl">RM.PL</a></li>
<li><a href="http://www.strona.pl">RM.PL</a></li>
</ul>
</div>
<div id="page">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Nam non turpis eget sapien ultrices semper eu eu leo.
Nulla hendrerit erat eu augue consectetur adipiscing.
Sed ac velit ligula. Nulla aliquet elementum ultricies.
Nulla porta auctor mi, sed faucibus ligula lobortisullamcorper.
Quisque at dictum nisi. Class aptent taciti sociosqu ad litora
torquent per conubia nostra, per inceptos himenaeos. Aenean placerat sodales tristique. Donec nunc elit, aliquet nec cursus id, volutpat malesuada lacus. Phasellus hendrerit sagittis elit, vel pellentesque ante aliquet sed. Proin commodo quam nec risus dignissim volutpat. Maecenas adipiscing facilisis purus, vitae congue metus sagittis et. Suspendisse iaculis lacus neque. Praesent lobortis leo et dui pellentesque quis eleifend magna iaculis. </p>
</div>
<div id="right">
PRAWE MENU
</div>
<div class="clear"></div>
<div id="footer">
STOPKA
</div>
</div>
</body>
</html>Kod: Zaznacz cały
body, table, td, th {
margin: 0px;
padding: 0px;
font-family: arial;
font-size: 12px;
background-color: #000000;
}
#content {
width: 800px;
margin: 0 auto 0 auto;
}
#top {
height: 150px;
background: #afffaf;
}
#left {
width: 150px;
background: #00ab00;
float: left;
}
#page {
width: 500px;
background: #cfffcf;
border-left: 1px solid black;
float: left;
}
#right {
width: 150px;
background: #00ab00;
float: left;
}
#footer {
background: #006d00;
height: 20px;
}
#page p {
text-transform: uppercase;
color: #000000;
font-size: 10px;
font-style: italic;
}
#left ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}
#left ul li a, #left ul li a:visited {
display:block;
border:2px solid #295c17;
text-align:center;
background:#32741c;
padding:2px;
margin:2px;
color:white;
text-decoration:none;
font-weight:bold;
}
#left ul li a:hover {
background: #429128;
}
.clear {
clear:both;
}
No i drugie pytanie: co zrobić, żeby prawy i lewy div wydłużały się razem ze środkowym?
Z góry dziękuję za odpowiedź.
