ThemeShaper Forums » Thematic

[closed]

How to put menu on bottom of header?

(2 posts)
  • Started 3 years ago by tonib
  • Latest reply from middlesister
  • This topic is not resolved
  1. I want the access div to line up with the bottom of the header as is does on the home page of this site:
    http://massage2.ugivegoodweb.com/

    For whatever reason, there's a gap between the bottom of the access div and the bottom of the header on every other page. Any ideas on how to get it flush w/the header bottom? I tried to add a function to add a 2nd header on the front page, but deleted it. I don't know if that has anything to do w/it.

    Any help you can give is greatly appreciated.

    These are the only functions I added to functions.php

    // Adds a home link to your menu
    // http://codex.wordpress.org/Template_Tags/wp_page_menu
    //function childtheme_menu_args($args) {
    // $args = array(
    // 'show_home' => 'Home',
    // 'sort_column' => 'menu_order',
    // 'menu_class' => 'menu',
    // 'echo' => true
    // );
    // return $args;
    //}
    //add_filter('wp_page_menu_args','childtheme_menu_args');

    // Unleash the power of Thematic's dynamic classes
    //
    // define('THEMATIC_COMPATIBLE_BODY_CLASS', true);
    // define('THEMATIC_COMPATIBLE_POST_CLASS', true);

    // Unleash the power of Thematic's comment form
    //
    // define('THEMATIC_COMPATIBLE_COMMENT_FORM', true);

    // Unleash the power of Thematic's feed link functions
    //
    // define('THEMATIC_COMPATIBLE_FEEDLINKS', true);

    /* Remove Comments From Pages*/
    function remove_comments(){
    if(is_page()){
    remove_action('thematic_comments_template','thematic_include_comments',5);
    }
    }
    add_action('template_redirect','remove_comments');

    Here's the css for the header and access div:

    /* =Header
    -------------------------------------------------------------- */

    #header {
    width: 960px;
    margin: 0 auto;
    z-index:2;
    /*background: transparent url(images/banner.jpg) no-repeat;*/
    background: #C0C489;
    height:175px;
    }

    #branding {
    padding:5px 0px 10px 0px;
    width: 960px;
    }

    #blog-title {
    font-family:Arial,sans-serif;
    font-size:30px;
    font-weight:normal;
    line-height:18px;
    color: #000;
    }

    #blog-title a {
    color:#FFF;
    text-decoration:none;
    /*background:url(images/name1.jpg) no-repeat;*/
    display:block;
    text-indent:-9000px;
    width: 300px;
    height: 80px;

    }
    #blog-title a:active,
    #blog-title a:hover {
    color: #FFF;
    }
    #blog-description {
    color:#666;
    font-size:13px;
    font-style:italic;
    position:relative;
    padding: 0px 0 0px;
    }

    #blog-description h1 {
    display:none;
    }
    /* =Menu
    -------------------------------------------------------------- */

    .skip-link {
    display:none;
    }
    #access {
    border-bottom:1px solid #ccc;
    height:40px;
    font-size:14px;
    overflow:visible;
    z-index:100;
    /*background: transparent url(images/menubg1.jpg) no-repeat;*/
    background-color: #006E89;
    }
    /*** ESSENTIAL STYLES ***/
    .sf-menu, .sf-menu * {
    margin: 0;
    padding: 0;
    list-style: none;
    }
    .sf-menu {
    /*line-height: 3.1;*/
    line-height: 1.1;
    }
    .sf-menu ul {
    position: absolute;
    top: -999em;
    width: 10em; /* left offset of submenus need to match (see below) */
    }
    .sf-menu ul li {
    width: 100%;
    }
    .sf-menu li:hover {
    visibility: inherit; /* fixes IE7 'sticky bug' */
    }
    .sf-menu li {
    float: left;
    position: relative;
    }
    .sf-menu a {
    display: block;
    position: relative;
    }
    .sf-menu li:hover ul,
    .sf-menu li.sfHover ul {
    left: 0;
    top: 2.5em; /* match top ul list item height */
    z-index: 99;
    }
    ul.sf-menu li:hover li ul,
    ul.sf-menu li.sfHover li ul {
    top: -999em;
    }
    ul.sf-menu li li:hover ul,
    ul.sf-menu li li.sfHover ul {
    left: 10em; /* match ul width */
    top: 0;
    }
    ul.sf-menu li li:hover li ul,
    ul.sf-menu li li.sfHover li ul {
    top: -999em;
    }
    ul.sf-menu li li li:hover ul,
    ul.sf-menu li li li.sfHover ul {
    left: 10em; /* match ul width */
    top: 0;
    }

    /*** THEMATIC SKIN ***/
    .sf-menu {
    border-right:none;
    float:left;
    font-family: arial, sans-serif;
    }
    .sf-menu a {
    border-left:none;
    border-top:none;
    border-bottom:none;
    padding:9px 13px;
    text-decoration:none;
    }
    .sf-menu .current_page_item a,
    .sf-menu .current_page_ancestor a,
    .sf-menu .current_page_parent a {
    border-bottom-color:none;
    }
    .sf-menu a, .sf-menu a:visited { /* visited pseudo selector so IE6 applies text colour*/
    color: #FFF;
    }
    .sf-menu li {
    background: transparent (url images/menubg1.jpg) repeat-x;
    }
    .sf-menu li li {
    background: transparent (url images/menubg1.jpg) repeat-x;
    }
    .sf-menu li li li {
    background: #9AAEDB;
    }
    .sf-menu li:hover, .sf-menu li.sfHover,
    .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
    /*background: #fafafa;*/
    /*background: transparent url(images/menubg1.jpg) no-repeat;*/
    outline: 0;
    border-bottom-color:#ccc;
    color: #7DDBDF;
    }
    .sf-menu ul {
    border-right:1px solid #ccc;
    border-bottom:1px solid #ccc;
    }
    .sf-menu li:hover ul,
    .sf-menu li.sfHover ul {
    top:32px; /* overriding essential styles */
    }
    .sf-menu ul ul {
    margin-top:0;
    }
    .sf-menu ul a {
    background:#fafafa;
    border-bottom:none;
    }
    .sf-menu ul a:hover {
    color: #FF4B33;
    }

    Thanks in Advance for Your Help

    Posted 3 years ago #
  2. middlesister
    Member

    This has not to do with your functions.php but with your css. On the home page, the #blog-description is a h1 and has margins added to it that pushes the #access div further down. On all other pages, it is a normal div without margins and thus the #access comes higher up.

    Your reset stylesheet (and the other stylesheets you add with @import) is not loading. Check your paths in style.css.

    Posted 3 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.