horizontal navigation nightmare...

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Locked
jen

horizontal navigation nightmare...

Post by jen »

Hello,

I'm having problems sorting out my horizontal navigation bar at www.cateringconnection.co.uk/cms. It looks as intended in firefox but is a bit of a mess in IE.

The problem started when I changed float: left to float: right in order to move the links over to the right hand side, somehow I ended up reversing the links so home was on the right - I switched the order in the page manager thinking that it would solve the problem and visually it did but the sites first page changed from the home page to the content page... I tried to put things back but I seem to have more problems than I know how to sort out.

I'll post my nav-horizontal stylesheet here incase any css experts can see what I've done wrong but if not could anyone let me know what this stylesheet looked like before I messed it up. I have a download of CMSMS but I can't find where the stylesheets are so if anyone knows please can they let me know or if there's someone out there with a fresh install a copy-paste of an unmodified default nav-horizontal stylesheet would be most appreciated...

I hope someone can help.

Cheers,
Jen
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: horizontal navigation nightmare...

Post by Dr.CSS »

/* A CSS Framework by Mike Stenhouse of Content with Style, adapted to CMSMS by Daniel Westergren */

/* NAV */

    * html div#menu_horiz {
        /* hide ie/mac \*/
        height: 1%;
        /* end hide */
    }
    div#menu_horiz {
      background-color: #ECECEC;
      width: 100%;
      margin: 0;
      text-align: center;
    }
    div#menu_horiz ul {
        margin: 0;
        padding: 0;
        list-style: none;
        border-bottom: 1px solid #C0C0C0;
        border-left:  1px solid #C0C0C0;
    }
    div#menu_horiz li {
        float: left;
        display: inline;
        list-style: none;
        margin: 0 ;
        border-right: 1px solid #C0C0C0;
    }
    div#menu_horiz li a {
        border-right: none;
    }
    div#menu_horiz a,
    div#menu_horiz a:link,
    div#menu_horiz a:active,
    div#menu_horiz a:visited {
        display: block;
        padding: 5px 10px;

        /* hide from ie/mac \*/
        display: block;
        /* end hide */

        text-decoration: none;
        margin: 0;
        color: #18507C;
        background: #ECECEC;
    }
div#menu_horiz li a:hover {
background-color: #abb0b6;
}
    div#menu_horiz .activeparent {
        display: inline-block;

        /* hide from ie/mac \*/
        display: block;
        /* end hide */
       
background-color: #abb0b6;
    }

    div#menu_horiz .current a,
    div#menu_horiz .current a:link,
    div#menu_horiz .current a:active,
    div#menu_horiz .current a:visited,
    div#menu_horiz .current a:hover,
    div#menu_horiz .activeparent a,
    div#menu_horiz .activeparent a:link,
    div#menu_horiz .activeparent a:active,
    div#menu_horiz .activeparent a:visited,
    div#menu_horiz .activeparent a:hover
{
background-color: #abb0b6;
    }
/* END NAV */

div#menu_horiz li.active01 h3 {
        display: inline-block;
        padding: 5px 10px;

        /* hide from ie/mac \*/
        display: block;
        /* end hide */
        font-size: 1em;
        line-height: 1em;
        text-decoration: none;
        margin: 0;
        color: #18507C;
        background-color: #abb0b6;
    }

#menu_horiz li.active02 h3 {
  display: block;
  text-decoration: none;
  padding: 5px 5px 5px 10px;
  font-weight: normal;
  color: #18507C;
  margin: 0;
  font-size: 1em;
  background-color: #abb0b6;
  }

#menu_horiz li.active03 h3
{
  display: block;
  padding: 3px 5px 3px 25px;
  border-bottom: none;
  font-size: 90%;
  font-weight: bold;
  color: #18507C;
  margin: 0;
}
jen

Re: horizontal navigation nightmare...

Post by jen »

Thanks very much Mark. Got is sorted now.

Cheers!

Jen
Locked

Return to “Layout and Design (CSS & HTML)”