[SOLVED] how to style menus...
How do I make the menus entirely transparent (so we just see the background image), with the border top and bottom of 1px and blue?
Thanks, Derek http://www.1775thebook.com |
This worked for me but you might also want to delete or comment the menu CSS in ATO>Add HTML/CSS Inserts>CSS Inserts
HTML Code:
.menu-item { |
Thanks for the reply. I should've stated: I only want it transparent when it is either a) not on the page or b) not hovered over. Otherwise, I want the hover color and the color selected when it is on that page. How do I do this?
|
Also, since I've been tweaking this code, I've now lost something: when you hover over them as is, the hover color is #CCCCCC, which is the "parent" color as set in ATO>Menu 1. It used to be, and I expected it to be, #880000, the color I have set in ATO>Menu 1 for hover. Any ideas on this?
(I added juggledad's cheatsheet, and since then, this has cropped up. His menus cheat sheet CSS: http://forum.bytesforall.com/showthr...us+transparent ) |
the cheat sheet is just a guide so you can see which CSS effects which area of the menus. You should remove it once you understand the area of the CSS to change.
|
Okay, I nearly have it the way I want.
I've got the menu generally transparent with the first bit of code here, as given above, but color the other links accordingly, and do not call for any transparency anywhere else in the CSS, except as noted below. Code:
div#menu1 ul.rMenu { How do I change the color of the tab for the page you are presently on? It does not seem to be effected by any of ul.rMenu li, ul.rMenu li a:link, ul.rMenu li a:visited, ul.rMenu li a:hover, ul.rMenu li a:active except where changes to those effect all of the buttons. I think the elements I want to change are these, but I got no results when I tried them: Code:
ul.rMenu li.current-menu-item, ul.rMenu li.current_page_item, ul.rMenu li.current-page-item { |
the reason it won't take is that there is a background set in the CSS for the links (the <a>) in the code for the pseudo classes. you need to use
HTML Code:
div#menu1 ul.rMenu li.current-menu-item a:link, |
That worked perfectly, except I had to declare the two items were important. That is, I duplicated your code, but made the two CSS styles as:
Code:
background-color: #336699 !important; Last question: How do I limit the Code:
div#menu1 ul.rMenu { |
you can't without messing with the theme code. The menu is part of the header and the header is a row of a table that spans the width of the table that has 1 - 5 (depending on the number of sidebar) columns. You would have to rewrite a bunch of code,
you could play with adding a widget area to the header with two cells and add a page widget to it and formatting that. |
how about this: is it possible to turn off the menu at the top (which I know how to do) and then place it above the loop? (which I don't know how to do)
|
PS: Happy Thanksgiving!
|
not without digging into the code
|
oh well, thanks for your help!
|
All times are GMT -6. The time now is 05:31 AM. |
Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.