CMS Made Simple Forums

Some time ago I switched my layout to the theme andreas01 from themes.cmsmadesimple.org and adapted it to my needs. Some of the content didn't fit into the layout, so I copied the template and stylesheets and replaced it with the CSS Menu Horizontal. This whole thing I used on the specific content that didn't fit. It does now, but the menu doesn't. It misbehaves in IE and Firefox in two completely different ways! And although the dropdown menu is horizontal style, the menu itself isn't. I must confess that I'm not the CSS crack, so I'm really happy for any help.

Please have a look! 

http://www.bugovsky.com/index.php?page=Ballkalender

it looks like you are still using the Verticle menu...

for horizontil use this.....

/* The wrapper clears the floating elements of the menu */
#menuwrapper{width:100%}

/* Set the width of the menu elements at second level. Leaving first level flexible. */

#primary-nav li li {
        width: 170px;
      }


/* Unless you know what you do, do not touch this */
#primary-nav{
list-style: none;
margin: 0px 15px;
padding: 0px;
       
}
#primary-nav ul {
list-style: none;
margin: 0px;
padding: 0px;

}
#primary-nav ul {
position: absolute;
top: auto;
display: none;
}
#primary-nav ul ul {
margin-top: 1px;
margin-left: -1px;
left: 100%;
top: 0px;
}

#primary-nav li {
margin-left: -1px;
float: left;
}
#primary-nav li li {
margin-left: 0px;
margin-top: -1px;
float: none;
position: relative;
}

and set the avmenu....


#avmenu {
/*clear: left;
float: left;*/
width: 100%;
margin: 0 4px 4px 0;
padding: 0;
font-size: 0.9em;
}

and you get the look in the img. below.....

    mark

[attachment deleted by admin]

Hi, thanks for the moment. I'll try that when I come back from the weekend. I'm having a fencing tournament this saturday and sunday, so will check it out sunday. Looks promising, though.

I played around with it but couldn't make it to work.

THANKS from my end of the modem line

did you use it all and not any of yours?...
that screenshot is what i ended up with by replacing all your stuff except the actual styling as in colors and padding, margins,...
if you make the page wider the menu will not be so cramped on top of itself...

  mark
unless of course your looking for something else...

Hi,
now I finally had a chance to look into it. I tried and it resulted in exactly the same layout as in your picture. Well, it looks different in IE. Still vertical there. And in Firefox, the first picture sticks to the menu, which shouldn't be.

you need to change...





delete everything in red, IE can't get there that way, it's a protected directory, one way to test it is to put that line in IE add. bar and see if you can get there,... hence the JS not working in IE...

this needs another ....

     
     
 
 

because of this... 2 starting ... it make the browsers think this div stops way down(actually it never closes, there aren't enuf closing divs for starting divs) your page putting every thing in one 'box'


     
        Menu:
       


 
      mark

Hmmm... IE can access the htp://www.bugovsky.com/modules/CSSMenu/CSSMenu.js. I tried it and I could download the file. And I can't delete the http://www.bugovsky.com in the address as that's part of CMSMS's doing.

I added the second , but it still looks the same...

you have one of your style sheet marked as media screen and one as print which ones are marked this way...
print is for when someone wants to print the info on the page like your schedule... print usually has the styles stript out so you get plain text...
try taking out the screen setting at the bottom of the template it's on the one with...
/* A CSS Framework by Mike Stenhouse of Content with Style, adapted to CMSMS by Daniel Westergren */

/* clearing */
.stretch,
.clear {
clear:both;
height:1px;
margin:0;
padding:0;
font-size: 15px;
line-height: 1px;
}

trying that it got even worse. the content is "out of bounds", to use a golf-term.

take one of those out it looks like another one got thrown in from the menu template some how...

Links

Administration
 

      <<< delete one
     

ok, we're back to square one. I deleted the div tag you told me to insert and reinserted the screen res info you told me to delete. Still not getting better.

ok try this, notice it's below the other h2 a must to work....

#content h2 {
font-size: 1.5em;
margin: 0 0 0.5em 0;
}
#main h2{margin-top:120px}

this centers the img. and title....

ok, image and title is centered now, but the menu still won't work in IE.
Look:

you might want to just make a new copy of the template for that page and make it wider to make room for the menu on the left...
if the menu works in IE...

still think you might want to try this in the ...

well, actually, I can access the CSS file with the IE. And secondly, I can not change the path. Because it's something that CMSMS embeds itself. It's not in the template, but hardcoded.

The real problem is that I had a template and associated css files for vertical. When I made it to horizontal, the CSS Menu Horizontal Template collides with the CSS from the template. I know it does. But I can't seperate these two. That's essentialy my problem. And as I did'nt do the template, but got it from the theme repository, I don't know enough to change it.

Making the template wider isn't an option, because there are a few contents that are "x-large" like this. And I would have to tailor one espescially for each content. So, no. I need it to work that way. But of course thanks for any help so far. It gets better every time.