W moim kodzie rozwija się menu, ale w raz z nim div "content", i chciałbym się tego pozbyć, ale nie pamiętam jaki kod napisać w CSS. Jakby co rozwijanym elementem jest to co pod linkiem "News"
XHTML
Kod
<!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-us" lang="en-us">
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="/scripts/kohana/css/style.css" />
</head>
<body>
<div id="all">
<div id="menu">
<div class="menu">
<ul>
<li><a href="#">News</a>
<ul class="sub">
<li><a class="news" href="#">Add news</a></li>
<li><a class="news" href="#">Edit news</a></li>
</ul>
</li>
</div>
<li><a href="#">Comments</a></li>
<ul class="sub">
<li><a href="#">Add Comments</a></li>
<li><a href="#">Edit Comments</a></li>
</ul>
<li><a href="#">Ban</a></li>
</ul>
</div>
<div id="content">
<span>Something</span>
</div>
</div>
</body>
</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-us" lang="en-us">
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="/scripts/kohana/css/style.css" />
</head>
<body>
<div id="all">
<div id="menu">
<div class="menu">
<ul>
<li><a href="#">News</a>
<ul class="sub">
<li><a class="news" href="#">Add news</a></li>
<li><a class="news" href="#">Edit news</a></li>
</ul>
</li>
</div>
<li><a href="#">Comments</a></li>
<ul class="sub">
<li><a href="#">Add Comments</a></li>
<li><a href="#">Edit Comments</a></li>
</ul>
<li><a href="#">Ban</a></li>
</ul>
</div>
<div id="content">
<span>Something</span>
</div>
</div>
</body>
</html>
CSS:
Kod
html, body {
margin: 0;
padding: 0;
background-color: #CBCBCB;
}
#all {
width: 750px;
margin: 0 auto;
}
ul, ul li {
padding: 0;
margin: 0;
list-style-type: none;
display: inline;
}
ul a:link, ul a: visited {
list-style-type: none;
}
.news {
display: block;
text-decoration: none;
}
.sub {
display: none;
text-decoration: none;
}
.menu:hover ul.sub {
display: block;
color: yellow;
}
#content {
background-color: green;
border: solid 1px black;
}
margin: 0;
padding: 0;
background-color: #CBCBCB;
}
#all {
width: 750px;
margin: 0 auto;
}
ul, ul li {
padding: 0;
margin: 0;
list-style-type: none;
display: inline;
}
ul a:link, ul a: visited {
list-style-type: none;
}
.news {
display: block;
text-decoration: none;
}
.sub {
display: none;
text-decoration: none;
}
.menu:hover ul.sub {
display: block;
color: yellow;
}
#content {
background-color: green;
border: solid 1px black;
}
