CMS Made Simple Forums

Posted: **Sat Aug 12, 2006 5:05 pm**

Hi CMSMS forum,

Thank you for af great site management system. I love to work with it.

I have a small problem and it puzzles me, since I was able to get this working in the 0.13 "canary" version,
but not in the latest release 1.0 beta4 version.

I want a horisontal CSS menu that should have blue background and white text on hover (sort of invert colors...).

excerpt from template: CSSMenu top + 1 column

Code: Select all

::
::
<!-- Start Navigation -->
      <div id="menu_vert">
         <h2 class="accessibility">Navigation</h2>
         {menu template='cssmenu.tpl'}
      <hr class="accessibility" />
      </div>
      <!-- End Navigation -->
::
::

excerpt from stylesheet: Layout: Top menu + 1 column

Code: Select all

::
::
/* remove underline on hover and change color */
a:hover {
   text-decoration: none;
   background-color: #0000FF; /*#C3D4DF*/
   color: #FFFFFF; /*#385C72*/
}
::
::

I get the blue background allright, but the text remains blue'ish (not white). See also snapshot attached.

How do I get the text to be white on hover? (it worked in 0.13 "canary").

Kind regards / Lars

CMSMS v. 1.0 Beta4
Opera v.9.0
IE v. 6.0
Firefox v.1.0.7
Webcalender v. 1.0.3
Windows XP platform SP2
XAMPP for Windows Version 1.5.3a (PHP Version 5.1.4, Apache 2.2.2)

[attachment deleted by admin]

Posted: **Sat Aug 12, 2006 6:36 pm**

That's not very hard - use these (maybe you have to modify the color codes):

Code: Select all

#topmenu a {
  background-color: blue;
  color: white;
  text-underline: none;
}

#topmenu a:hover {
  background-color: white;
  color: blue;
}

You have to modify the captions of the css-classes to fit your template.

Posted: **Sat Aug 12, 2006 8:46 pm**

If you rite clik and look at the source, view source, you will find the id it should be since you are using, according to your img., the horiz menu.

The CSS is...

menu_horiz li a:hover{background-color:#0000FE; color: #FFFFFF }

A good place to get color numbers, aka hex numbers,...

http://www.colorschemer.com/online.html

Posted: **Sun Aug 13, 2006 12:46 pm**

Hi Mark,

Thank you very much for the tip. I am still a beginner in CSS stuff... It was my template that had a problem.
Strangely...I copied it from the standard CMSMS v.10-beta4 installation - the one that is called "CSSmenu top + 2 columns".
That template says

Code: Select all

::
::
<!-- Start Navigation -->
      <div id="menu_vert">
         <h2 class="accessibility">Navigation</h2>
         {menu template='cssmenu.tpl'}
      <hr class="accessibility" />
      </div>
      <!-- End Navigation -->
::
::

The "id=menu_vert" is mentioned in the stylesheet "Navigation: Simple - Vertical". Maybe
there is a typo in the standard template called "CSSmenu top + 2 columns". Furthermore the
standard template does not have the stylesheet "Navigation: Simple - Horizontal" assigned,
where the "id="menu_horiz" is placed.

I used the "id="menu_horiz" in the template instead and the corrosponding stylesheet.
It works fine now (off course...)

Kind regards / Lars

[attachment deleted by admin]

Posted: **Sun Aug 13, 2006 5:00 pm**

Good.

CMS Made Simple Forums

CSSmenu top & font color & hover

CSSmenu top & font color & hover

Re: CSSmenu top & font color & hover

Re: CSSmenu top & font color & hover

Re: CSSmenu top & font color & hover

Re: CSSmenu top & font color & hover