HTML Editor 2009 CSS Menu Designer -...

User 512392 Photo


Trial User
4 posts

Folks, I now have it working. Here is the "problem". Scott's example shows a width of 800px. Duh. that is the width of my screen at my resolution. The ACTUAL width of the menu in my case is 450. So you always need to make sure that the width specification is correct. Once I changed that, Scott's simple style worked to center the menu within a DIV. In my case that html looks like this [see other example that also works that follows]

<div style="margin: 0pt auto; width: 450px;">
<ul class="menu-menu">
<li class="first"><a href="http://">Pictures</a></li>
<li><a href="http://">Films</a></li>
<li><a href="http://">ride reports</a></li>
<li><a href="http://">rides and events calendar</a></li>
</ul>
</div>
And by the way that is zeropt 0pt auto in line one

Now, what will also work is this code, Again, the key is to get the width of the menu bar exactly right.

<div style="width:450px; margin-left: auto ; margin-right: auto ">
<ul class="menu-menu">
<li class="first"><a href="http://">Pictures</a></li>
<li><a href="http://">Films</a></li>
<li><a href="http://">ride reports</a></li>
<li><a href="http://">rides and events calendar</a></li>
</ul>


User 476017 Photo


Ambassador
375 posts

Hi Guys
I am also having the same problem trying to centre a horizontal menu.
David I tried the sample code you supplied but I'm sorry to say it does not centre my sample menu.
Also I have found another problem my sub menus are overlaid when they hit coding to change from a single column heading section to a 3 column content section
You can see an example at web page
http://www.orrufc.co.uk/test_index.html
I am trying to replace my Likno AllWeb menu which sits under a photo banner.
If you move the cursor over juniors sub menus for under 17's - under 10's display but under 9's and under 8's are overlaid by my 3 column section.
Not sure if this is my poor CSS/Html coding or a glitch with CSS menu maker
Dave Butler
Yorkshire
England

Old Rishworthians Rugby Union Football club http://www.orrufc.co.uk
Tuxedo Junction Yorkshire Function Band http://www.riley-tuxedojunction.co.uk
The Commons Guest House http://www.thecommons-guesthouse.co.uk
all created with Coffee Cup html editor
User 184085 Photo


Ambassador
1,707 posts

Dave Butler wrote:
Hi Guys
I am also having the same problem trying to centre a horizontal menu.
David I tried the sample code you supplied but I'm sorry to say it does not centre my sample menu.
Also I have found another problem my sub menus are overlaid when they hit coding to change from a single column heading section to a 3 column content section
You can see an example at web page
http://www.orrufc.co.uk/test_index.html
I am trying to replace my Likno AllWeb menu which sits under a photo banner.
If you move the cursor over juniors sub menus for under 17's - under 10's display but under 9's and under 8's are overlaid by my 3 column section.
Not sure if this is my poor CSS/Html coding or a glitch with CSS menu maker


the css menu is set to z-index:2; some of your items are set to 1000 those will display on top of your menu.

can you attach you post just your menu code?
Volunteering to help :)
http://www.tbaygeek.ca
My HTML play area
http://www.tbaygeek.ca/test/
User 512392 Photo


Trial User
4 posts

Dave, you need to make sure that you have a menu-menu.css file created by HTML Editor. THEN take the resulting menu you created and put it within a div. See my example code. Why not first see if you can make your menu work on a blank page and center it. Then you know the approach works and the challenge becomes how to drop it into your active page and if it does not work what is inteferring.
User 463058 Photo


Ambassador
1,073 posts

Dave Butler wrote:
David I tried the sample code you supplied but I'm sorry to say it does not centre my sample menu.


This is the code you have:
<div style="width:800px; margin:0 auto;"><ul class="menu-menu">


Try this instead:
<div><ul class="menu-menu" style="width:370px; margin:0 auto; position:relative">
User 476017 Photo


Ambassador
375 posts

Hi Cary
Thanks for the input.
Your line of coding has solved the problem.
I now have a centred menu.
Thanks for your help Guys
regards
Dave
Dave Butler
Yorkshire
England

Old Rishworthians Rugby Union Football club http://www.orrufc.co.uk
Tuxedo Junction Yorkshire Function Band http://www.riley-tuxedojunction.co.uk
The Commons Guest House http://www.thecommons-guesthouse.co.uk
all created with Coffee Cup html editor
User 476017 Photo


Ambassador
375 posts

BTW Guys
Has anyone noticed if you select the preview tab inthe CSS menu editor
it does not simulate the html/css coding that is generated.
Only the root items appear no sub items or siblings.
Am I missing someting here???
Dave Butler
Yorkshire
England

Old Rishworthians Rugby Union Football club http://www.orrufc.co.uk
Tuxedo Junction Yorkshire Function Band http://www.riley-tuxedojunction.co.uk
The Commons Guest House http://www.thecommons-guesthouse.co.uk
all created with Coffee Cup html editor
User 512392 Photo


Trial User
4 posts

Dave
Congrats. Recall that the very very first thing I brought to light was the need to specify the width of the menu correctly. I believe that your experience and mine suggest that Coffee Cup needs a small help file about this especially for a novice like myself. As for the preview tab on the css menu editor. Something is amiss in your set up. PREVIEW for the MENU EDITOR launches my default browser and the root and sub items show. HOWEVER, within HTML Editor itself the visual editor tab and preview tab for html editor show only the root level. Perhaps that was your issue.
User 103173 Photo


VP of Software Development
0 posts

Dave Butler wrote:
BTW Guys
Has anyone noticed if you select the preview tab inthe CSS menu editor
it does not simulate the html/css coding that is generated.
Only the root items appear no sub items or siblings.
Am I missing someting here???


I cannot replicate that here. The preview launches your default browser and will work the same as if it was on your Website.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
User 476017 Photo


Ambassador
375 posts

Hi Guys
it sounds like a setup problem on my PC
Selecting the preview tab in CSS menu also launches my default browser IE7.
But the menu is not in the centre and displays no sub items and siblings
This is the path C:\orrufc\rishworthian2\~dhtml.htm

Now the rub is if I select preview in html editor the menu displays correctly centred with sub items and siblings.

Also if I select tools - test with default browser from the html editor the menu displays OK centred with sub items and siblings
the path is C:\orrufc\rishworthian2\~tmD5.html

It seems as if the preview in CSS menu has a setup problem on my PC
But only guessing I am fairly new to CC products.
Dave Butler
Yorkshire
England

Old Rishworthians Rugby Union Football club http://www.orrufc.co.uk
Tuxedo Junction Yorkshire Function Band http://www.riley-tuxedojunction.co.uk
The Commons Guest House http://www.thecommons-guesthouse.co.uk
all created with Coffee Cup html editor

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.