index.php:
<?php defined( '_JEXEC' ) or die( 'Restricted access' );?>
<!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"
xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
<head>
<jdoc:include type="head" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template?>/css/template.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template?>/css/buttonbar.css" type="text/css" />
</head>
<body>
<div id="container">
<div id="banner"><jdoc:include type="modules" name="top" /></div>
<div id="buttonbar"><ul class="menu">
<li id="item-101" class="current active deeper parent"><a href="/" >Home</a><ul><li id="item-103"><a href="/index.php/home/drop-down-ttest" >Drop Down Test</a></li><li id="item-104"><a href="/index.php/home/contact-2" >Contact (2)</a></li></ul></li><li id="item-102"><a href="/index.php/contact" >Contact</a></li></ul>
</div>
<div id="content"><jdoc:include type="component" /></div>
</div>
</body>
</html>
template.css:
body
{
font-family:Arial,Helvetica,sans-serif;
}
#container
{
width:90%;
min-width:800px;
min-height: 700px;
margin-top: -10px;
margin-left: auto;
margin-right: auto;
background-color: #dbdbdb;
}
#banner
{
width:100%;
height: 100px;
}
#content
{
position:relative;
top: 0px;
z-index: 9;
}
buttonbar.css
#buttonbar
{
position: relative;
z-index: 10;
width: 100%;
height: 50px;
margin: 0px;
padding: 0px;
text-decoration:none;
list-style-type: none;
text-align: center;
background-color: #2e2e2e;
}
#buttonbar ul li
{
display: blocks;
width: 200px;
padding-top: 10px;
list-style-type: none;
float: left;
}
#buttonbar ul li a
{
color: #ffffff;
font-size: 20px;
text-decoration: none;
}
#buttonbar ul li:hover a
{
color: #0090ff;
padding: 20px 15px 20px 15px;
background-color: #4d4d4d;
}
#buttonbar ul li ul li
{
display: none;
}
#buttonbar ul li:hover ul li
{
display:block;
padding: 0px;
}
#buttonbar ul li:hover ul li a
{
color: #ffffff;
font-size: 15px;
background-color: #4d4d4d;
}

New Topic/Question
Reply



MultiQuote


|