Problem with dropdown

[luther]

Today I started another try to implement your menu into my Site.

Now it works perfect, but there is one big problem:
I tried every posible option in CSS generator but it is not possible to create e horizontal dropdown menu with a vertical dropdown-box.
I don’t know what’s going wrong.

Here is the link:
http://nur-echt-mit-95-thesen.de/gemeinde/wp/

And here is my Suckerfish CSS:
[code:3v0wgrhj]#suckerfishnav {
    background:#6D1C61 repeat-x;
    font-size:10px;
    font-family:verdana,sans-serif;
    font-weight:bold;
    width:100%;
    }
#suckerfishnav, #suckerfishnav ul {
    float:left;
    list-style:none;
    line-height:20px;
    padding:0;
    border:1px solid #aaa;
    margin:0;
    width:100%;
    }
#suckerfishnav a {
    display:block;
    color:#dddddd;
    text-decoration:none;
    padding:0px 10px;
    }
#suckerfishnav li {
    float:left;
    padding:0;
    }
#suckerfishnav ul {
    position:absolute;
    left:-999em;
    height:auto;
    width:101px;
    font-weight:normal;
    margin:0;
    line-height:1;
    border:0;
    border-top:1px solid #666666;
    }
#suckerfishnav li li {
    width:99px;
    border-bottom:1px solid #666666;
    border-left:1px solid #666666;
    border-right:1px solid #666666;
    font-weight:bold;
    font-family:verdana,sans-serif;
    }
#suckerfishnav li li a {
    padding:4px 10px;
    width:80px;
    font-size:9px;
    color:#dddddd;
    }
#suckerfishnav li ul ul {
    margin:-18px 0 0 100px;
    }
#suckerfishnav li li:hover {
    background:#9F1F76;
    }
#suckerfishnav li ul li:hover a, #suckerfishnav li ul li li:hover a, #suckerfishnav li ul li li li:hover a, #suckerfishnav li ul li li li:hover a {
    color:#dddddd;
    }
#suckerfishnav li:hover a, #suckerfishnav li.sfhover a {
    color:#dddddd;
    }
#suckerfishnav li:hover li a, #suckerfishnav li li:hover li a, #suckerfishnav li li li:hover li a, #suckerfishnav li li li li:hover li a {
    color:#dddddd;
    }
#suckerfishnav li:hover ul ul, #suckerfishnav li:hover ul ul ul, #suckerfishnav li:hover ul ul ul ul, #suckerfishnav li.sfhover ul ul, #suckerfishnav li.sfhover ul ul ul, #suckerfishnav li.sfhover ul ul ul ul {
    left:-999em;
    }
#suckerfishnav li:hover ul, #suckerfishnav li li:hover ul, #suckerfishnav li li li:hover ul, #suckerfishnav li li li li:hover ul, #suckerfishnav li.sfhover ul, #suckerfishnav li li.sfhover ul, #suckerfishnav li li li.sfhover ul, #suckerfishnav li li li li.sfhover ul {
    left:auto;
    background:#6D1C61;
    }
#suckerfishnav li:hover, #suckerfishnav li.sfhover {
    background:#E84AB6;
    }
#suckerfishnav {position:absolute;bottom:0}
#suckerfishnav, #suckerfishnav ul {z-index:1000}
#suckerfishnav, #suckerfishnav ul {width:899px}[/code:3v0wgrhj]

I hope you can help me.

Edit: I think I’ve found the problem. I think this line of CSS-Code causes the problem:
[code:3v0wgrhj]#suckerfishnav, #suckerfishnav ul {width:898px}[/code:3v0wgrhj]

You told me in another thread to use this line, cause otherwise my navigation bar is some pixels to wide for my theme… is there a way to solve both problems? Or with other words: to get a navbar of the correct size with a working dropdown?

Edit2: When I change
[code:3v0wgrhj]#suckerfishnav, #suckerfishnav ul {
    float:left;
    list-style:none;
    line-height:20px;
    padding:0;
    border:1px solid #aaa;
    margin:0;
    width:100%;
    }[/code:3v0wgrhj]
into
[code:3v0wgrhj]#suckerfishnav, #suckerfishnav ul {
    float:left;
    list-style:none;
    line-height:20px;
    padding:0;
    border:0;
    margin:0;
    width:100%;
    }[/code:3v0wgrhj]
and delete
[code:3v0wgrhj]#suckerfishnav, #suckerfishnav ul {width:898px}[/code:3v0wgrhj]
it seems to work. But I would be glad if you can show me another solution which also includes borders.

Best wishes und greetings from Germany
luther

[imported_Ryan]

"luther" wrote:

I tried every posible option in CSS generator but it is not possible to create e horizontal dropdown menu with a vertical dropdown-box.

What do you mean by ‘vertical dropdown-box’? When I viewed your site the menu appeared to be working as expected.

[luther]

Yeah it works, but only because I changed
[code:3odl3pj9]    border:1px solid #aaa;[/code:3odl3pj9]
into
[code:3odl3pj9]    border:0;[/code:3odl3pj9]
and killed the line
[code:3odl3pj9]#suckerfishnav, #suckerfishnav ul {width:898px}[/code:3odl3pj9]

Is there a solution to have this working in the correct size AND with borders?

[imported_Ryan]

The CSS generator can create dropdowns with a border around them. What problems do you have when you try to use plain CSS from the CSS generator?

[luther]

Hello Ryan,
the problem is, when I use the original CSS from generator with borders, the navigation bar will be exactly the size of the borders too wide (I know that’s not English, but I hope you understand me ” title=”Wink” /> )

For example:
Given that there are 6 Items in my navigation bar, it will be 7 px too wide (5 borders between the Items, 1 left, 1 right)

Further Information just to help you a bit:
Used WP Version: 2.7.1
Used Theme: K2 (latest build)
Header file:
[code:3r5j19ov]<?php
/**
* Header Template
*
* This file is loaded by header.php and used for content inside the #header div
*
* @package K2
* @subpackage Templates
*/

// For SEO, outputs the blog title in h1 or a div
$block = ( is_front_page() ? ‘h1’ : ‘div’ );

// arguments for wp_list_pages
$list_args = k2_get_page_list_args(); // this function is pluggable

// if a page is used as a front page, exclude it from page list
if ( get_option(‘show_on_front’) == ‘page’ )
$list_args .= ‘&exclude=’ . get_option(‘page_on_front’);

?>

<?php echo "<$block class=’blog-title’>"; ?>
<a href="<?php echo get_option(‘home’); ?>/" accesskey="1"><?php bloginfo(‘name’); ?></a>
<?php echo "</$block>"; ?>

<p class="description"><?php bloginfo(‘description’); ?></p>

<p class="menu">
<?php if (function_exists(‘pixopoint_menu’)) {pixopoint_menu();} ?>
</p>[/code:3r5j19ov]

By the way: Deleting "<p class="menu">[…]</p>" doesn’t solve the problem.

[imported_Ryan]

Hi,
Sorry but I don’t understand. If you post an example of the problem in action I can probably work out how to fix whatever the problem is. I took at look at http://nur-echt-mit-95-thesen.de/gemeinde/wp/ but it seems to be working correctly.

[Author]

Posts