WordPress.org

Support

Support » Themes and Templates » Dropdown menu in Creativix-WP falls behind slideshow…

Dropdown menu in Creativix-WP falls behind slideshow…

  • Hi Guys – yes I know it’s a z-something or other, and I need to increase the value of the menu to over 1000 and reduce that of the menu to say, 1.
    But which file(s) do I modify the code in? I’ve gone through the css file and there’s no mention of this z-factor.

    You may need to be prepared for another question once this is answered, brave and honourable codegods/goddesses. I don’t know how to do divs so that needs to be explained. Before you ask me to wrap this and that into a div.

    Site is http://www.picture-kitchen.com/various

Viewing 15 replies - 1 through 15 (of 22 total)
  • WPyogi

    @wpyogi

    Forum Moderator

    Unless you have the option in your theme, you should be making CSS changes via a plugin such as Custom CSS Manager. That way your changes won’t get overwritten when the theme is updated. If you are modifying theme files (i.e. .php files) you should use a child theme.

    It looks like the problem with your current z-index is that you are missing the required position attribute:

    .navigation {
        background: url("images/navbar.png") no-repeat scroll 0 0 transparent;
        float: left;
        font-size: 12px;
        height: 48px;
        left: 8px;
        margin-top: 5px;
        padding-right: 18px;
        position: relative;
        vertical-align: baseline !important;
        width: 925px;
        z-index: 6;
    }

    Z-index only works when that’s included. Again, don’t make those changes in theme files, however.

    It is called z-index. Use firebug to quickly identify selectors. And always use child themes or plugins like Custom CSS Manager to keep your modifications safe from theme updates.

    I can’t find the issue with dropdown on your site. Can you please explain/screenshot which part of site have that issue?

    Thank you, both of you, for appearing with answers so quickly. I’ll try to work with all these new truths immediately.

    Aditya – if you go here and hover over illustration|animation|design’s dropdown menu, and you then hover over animation at the bottom, you’ll see the Irritation.

    Right – soooo…. I have the child theme made, with your code added WPyogi – many many thanks for that. Now where do you suggest I hunt down the z-index bit please? I searched through the menu and the slideshow files but didn’t see it. (Tks for the correct name for that… was getting too tired to mount a search for correct term by then)

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    Can you link the page with the issue?

    I should add that I took away the melded version of illustration|animation|design – you’ll still see this happening on here. when you hover over the lower bits of the design menu for instance.

    Hi Andrew – thanks for popping up – I’ve just posted the updated page; it would have caused a bit of confusion, sorry.

    I wanted to get the 3 different mentions of illustration|design|animation out of the way, since it appeared in the menu, the breadcrumbs and in the text. This is I hope, a bit simpler.

    Here’s what I followed to get thus far:
    How to Create a Child Theme
    Create a directory in your themes directory to hold the child theme. The themes directory is wp-content/themes. You can name the directory whatever you want, but it is common practice to use the name of the parent theme folder with “-child” appended to it. So, for instance, if you are making a child of the twentytwelve theme, your folder name would be twentytwelve-child.
    In the child theme directory, create a file called style.css. This is the only file required to make a child theme. etc etc

    But now WP is giving me some uphill about the theme not being complete – see cut & paste:

    CustomizeOPTIONS:WidgetsMenusWP-Creativix OptionsEdit CSSHeaderBackground
    Available Themes
    You only have one theme installed right now. Live a little! You can choose from over 1,000 free themes in the WordPress.org Theme Directory at any time: just click on the Install Themes tab above.

    Broken Themes

    The following themes are installed but incomplete. Themes must have a stylesheet and a template.

    Name Description
    WP-Creativix Child The parent theme is missing. Please install the “WP-Creativix” parent theme.

    (But the WP-Creativix theme is clearly already installed and functioning well)

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    Try adding z-index to this element: #header,
    E.g:

    #header {
     z-index: 10;
    }

    Ah. Andrew, thank you.

    this would be in the styles.css I take it?

    Any idea about the template thing? I mean, what template? Where do they live? I had a quick riffle through the 3 main WP directories via Dreamweaver… can’t think where they’d store that… and until they see it, they won’t be happy.

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    this would be in the styles.css I take it?

    Following the advice of the two other posters, CSS modifications should be made in either a Custom CSS plugin or a Child Theme style.css file.

    Okay, found the template.php file under includes directory, and have simply cut and pasted it. Holding thumbs…

    Yes, have now put both the template.php file and the updated styles.css file into the child directory.

    Nope, still getting the same error message. Here’s my style.css:

    /*
    Theme Name: WP-Creativix Child
    Theme URI: http://www.wp-themix.org/themes/wp-creativix-free-premium-portfolio-wordpress-theme/
    Description:    Child theme for the WP-Creativix theme
    Author:         Savyra Meyer
    Author URI:     http://picture-kitchen.com/about/
    Template:       WP-Creativix
    Version:        0.1.0
    */
    @import url("../wp-creativix/style.css");
    #header {
     z-index: 10;
    }
    .alignnone {
    margin: 5px 20px 20px 0;
    }
    
    .aligncenter, div.aligncenter {
    display:block;
    margin: 5px auto 5px auto;
    }
    
    .alignright {
    float:right;
    margin: 5px 0 20px 20px;
    }
    
    .alignleft {
    float:left;
    display:inline;
    margin: 5px 20px 20px 0;
    }
    
    .aligncenter {
    display: block;
    margin: 5px auto 5px auto;
    }
    
    a img.alignright {
    float:right;
    margin: 5px 0 20px 20px;
    }
    
    a img.alignnone {
    margin: 5px 20px 20px 0;
    }
    
    a img.alignleft {
    float:left;
    margin: 5px 20px 20px 0;
    }
    
    a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
    }
    
    .wp-caption {
    background: #fff;
    border: 1px solid #EEE;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px !important;
    padding-bottom: 25px !important;
    text-align: center;
    }
    
    div.aligncenter {
    padding-bottom: 0px !important;
    }
    
    div.alignnone {
    margin: 0px;
    padding: 0px;
    display: block;
    margin: 5px 20px 20px 0;
    padding-bottom: 0px !important;
    }
    
    div.alignleft {
    margin: 5px 20px 20px 0;
    padding-bottom: 0px !important;
    }
    
    div.alignright {
    margin: 5px 0 20px 20px;
    clear: both;
    padding-bottom: 0px !important;
    }
    
    .wp-caption img {
    padding: 0px !important;
    border: none !important;
    height: auto;
    margin:0;
    max-width: 98.5%;
    padding:0;
    width: auto;
    }
    
    .wp-caption p.wp-caption-text {
    font-size:11px;
    line-height:17px;
    margin:0;
    margin-top: 5px;
    width: 100%;
    text-align: center;
    padding:0 4px 5px;
    }
    
    .sticky p {
    background: #f2f7fc;
    padding: 10px;
    }
    
    .gallery .gallery-caption {
    color: #888;
    font-size: 12px;
    margin: 0 0 12px;
    }
    
    .commentlist .bypostauthor {
    }
    .navigation {
        background: url("images/navbar.png") no-repeat scroll 0 0 transparent;
        float: left;
        font-size: 12px;
        height: 48px;
        left: 8px;
        margin-top: 5px;
        padding-right: 18px;
        position: relative;
        vertical-align: baseline !important;
        width: 925px;
        z-index: 6;
    }

    Oh I somehow didn’t notice the z-index: 6; at the bottom… is there a conflict between that and the header bit at the top?

    Off to have a cup of Earl Grey, fading fast.

Viewing 15 replies - 1 through 15 (of 22 total)
  • The topic ‘Dropdown menu in Creativix-WP falls behind slideshow…’ is closed to new replies.