0

我正在为我的标题使用手风琴菜单。我一直在尝试使菜单中的对齐正确。但它没有发生。<div>这是我的菜单和其他标签的样式表代码

html {
    margin: 0;
    padding: 0;
    height: 100%;
}
body {
    margin: 0;
    padding: 0;
    height: 100%;
    background: #FFFFFF;
}
body, td, th, input, select, textarea, option, optgroup {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #000000;
}
input[type='text'], input[type='password'] {
    padding: 2px;
}
select {
    padding: 1px;
}
textarea {
    padding: 2px;
}
a, a:visited {
    color: #003366;
    text-decoration: underline;
    cursor: pointer;
}
a img {
    border: 0;
}
form {
    margin: 0;
    padding: 0;
}
label {
    cursor: pointer;
}
#header .div1 {
    height: 56px;
    padding: 0px 30px;
    background: url('../image/header.png') repeat-x;
    min-width: 900px;
}
#header .div2 {
    color: #FFFFFF;
    padding: 18px 0px 0px 0px;
    float: left;
}
#header .div3 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #FFF;
    text-align: right;
    padding: 15px 0px 0px 0px;
    float: right;
}
#header .div2 span {
    font-weight: bold;
}

#container {
    height: 100%;
}
body > #container {
    height: auto;
    min-height: 100%;
}
#content {
    background: #FFFFFF url('../image/background.png') 0px 1px repeat-x;
    padding: 10px 30px 0px 30px;
    min-width: 1200px;
    padding-bottom: 128px;
}
#footer {
    background: #FFFFFF url('../image/footer.png') repeat-x;
    height: 90px;
    padding-top: 38px;
    text-align: center;
    font-size: 12px;
    color: #333;
    position: relative;
    margin-top: -128px;
    clear: both;
}
#footer a {
    color: #333;
    text-decoration: underline;
}
.breadcrumb, .breadcrumb a {
    font-size: 12px;
    color: #666;
    margin-bottom: 15px;
}
#menu{font-family: Helvetica, Arial, sans-serif;  font-size: 0.9em;}
ul#menu, ul#menu ul {

  list-style-type:none;
  margin: 0;
  padding: 0;
  width: 15em;
}

ul#menu a {
  display: block;
  text-decoration: none;    
}

ul#menu li {
  margin-top: 1px;
}

ul#menu li a {
  background: #006600;
  color: #fff;  
  padding: 0.5em;
}

ul#menu li a:hover {
  background: #006600;
}

ul#menu li ul li a {
  background:#F7F7F7;
  color: #000;
  padding-top: 3px;
  padding-bottom: 3px;
  line-height: 14px;
  background-image: url(arrow.gif);
  background-repeat: no-repeat;
  padding-left: 15px;
   border-bottom:0px;
}

ul#menu li ul li a:hover {
  background: #BFBFBF;
  border-left: 5px #006600 solid;
  padding-left: 10px;
}

和我的 tpl 页面代码

<body>
<div id="container">
<div id="header">
  <div class="div1">
    <div class="div2"><img src="view/image/logo1.png" title="<?php echo $heading_title; ?>" onclick="location = '<?php echo $home; ?>'" /></div>
    <?php if ($logged) { ?>

    <div class="div3"><img src="view/image/lock.png" alt="" style="position: relative; top: 3px;" />&nbsp;<?php echo $logged; ?></div>
    <?php } ?>
  </div>
  <?php if ($logged) { ?>

  <ul id="menu">
      <li id="dashboard"><a href="<?php echo $home; ?>" class="top"><?php echo $text_dashboard; ?></a></li>
      <li><a href="<?php echo $product; ?>" class="top"><?php echo $text_product; ?></a>
      <ul> <li><a href="<?php echo $product; ?>"><?php echo $text_product1; ?></a></li>
      <li><a href="<?php echo $manufacturer; ?>"><?php echo $text_manufacturer; ?></a></li>
      <li><a href="<?php echo $category; ?>"><?php echo $text_category; ?></a></li>
      <li><a href="<?php echo $option; ?>"><?php echo $text_option; ?></a></li>
      </ul></li>

      <li><a href="<?php echo $design; ?>" class="top"><?php echo $text_design; ?></a>
      <ul>

      <li><a href="<?php echo $banner; ?>"><?php echo $text_banner; ?></a></li>
      <li><a href="<?php echo $setting; ?>"><?php echo $text_setting; ?></a></li>
      </ul>
      </li>
</ul>

</div>
  <?php } ?>
</div>

附加的屏幕截图是我的页面现在的样子在此处输入图像描述 请建议我如何做进一步。

4

0 回答 0