I saw this thread:

http://forum.bytesforall.com/showthread.php?t=19550

And I've played with the developer tools for a while, but I can't find the class that controls the arrow buttons to the right of each menu item --or that controls the width of the menu items along the menu bar.

Any ideas where I'd find them?

Russ

ok, what HTML shows for a menu with a down arrow?

BTW, before someone says, "just mess with firebug and you'll figure it out..." I have done that. This is what my inspection shows for the menu element:

div#menu1 ul.rMenu li.current-menu-item a:link, div#menu1 ul.rMenu li.current-menu-item a:active, div#menu1 ul.rMenu li.current-menu-item a:hover, div#menu1 ul.rMenu li.current-menu-item a:visited, div#menu1 ul.rMenu li.current_page_item a:link, div#menu1 ul.rMenu li.current_page_item a:active, div#menu1 ul.rMenu li.current_page_item a:hover, div#menu1 ul.rMenu li.current_page_item a:visited, div#menu1 ul.rMenu li a:hover {
background-color: rgb(171, 5, 53);
color: rgb(255, 255, 254);
}

None of that looks like the little arrow to me --I can't select the arrow to look at it individually, using either the built in inspection tools, or firebug, either one. All I ever get is the class of the container the arrow is in, not what the individual elements of that class are.

So, if anyone know the class that controls the width of this box, or the arrow itself, it would be helpful.

Thanks!

Russ

Originally Posted by juggledad

ok, what HTML shows for a menu with a down arrow?

I'm not certain what you mean by this? ... I've posted what I see in the inspection window in my last post...

It tells me what the class _above_ the grey arrow is, but not what the grey arrow element actually is. Where would I find a list of all the possible elements within the original style sheet so I can find each element?

You can't select the arrow by itself.

Russ

we posted at the same time

when you use the inspector, you should see HTML like this

<li class="rMenu-expand page_item page-item-831">
   <a href="http://192.168.48.99/~paul/wp311/?page_id=831">
     <span>About The Tests</span>
   </a>
       <ul class="rMenu-ver">

now, if you inspect each element starting with the 'li' what CSS do you see?

Originally Posted by juggledad

we posted at the same time

when you use the inspector, you should see HTML like this

<li class="rMenu-expand page_item page-item-831">
   <a href="http://192.168.48.99/~paul/wp311/?page_id=831">
     <span>About The Tests</span>
   </a>
       <ul class="rMenu-ver">

now, if you inspect each element starting with the 'li' what CSS do you see?

Okay, so I've no idea what you're talking about...

When I right click on the element, I have the option to "inspect" that element. The button isn't something you can right click on. When I open firebug, I see html code, and here I can "inspect in a DOM window." But I really don't know css well enough to know, specifically, what it is I'm looking for. I can build simple css, but I really don't know enough css to do the depth of stuff you're talking about here.

Russ

So, looking through the list of images available in the theme, it looks like "expand-down" might be the one that's being used here. When I look at the dom elements, I see an element called "rMenu-expand," I assume these two are related (though, as a coder, I'd never name an image one thing, and the element that uses that image something completely different --I'd want them named the same so I can troubleshoot things easier later).

Assuming "rMenu-expand" is the right thing to modify, how do I modify it? I assume it's a CSS insert on the inserts page, but, what does that insert look like?

div#menu1 ul.rMenu {
background: red;
border: none 0px;
}

Must be the right place, but perhaps:

div#menu1 ul.rMenu-expand {}

But what goes in there to make the image go away?

And what is the class for making the individual menu items in the page menu a fixed width, or at least making the table 100% of the width of the container?

Russ

Go examine the HTML <a> element and tell me what CSS you see

No. I'm tired of this game.

Thanks for the lesson in fishing, but this isn't a matter of a lesson in fishing, this is a matter of a lesson in the deep dark recesses of the specific layout of a specific css class.

If someone can tell me the actual class name, please do.

Otherwise, I've contributed my last to this forum.

Russ

there is no class name. The the arrow it is a background image.

Ugh. Didn't I already point to this image, above? You could have simply said, "yes, that's the image you need to modify, and that's the easiest way to change the look..."

So the right solution is to replace this gif with an image that has the entire image as a single transparent color...

Thanks.

Russ

I could have given you the answer right off the bat, but that is not the way I work. I'm trying to teach people hw to find the answer themself.

If you don't like that and just want answers, I'm always avaliable for hire.