CSS menu Designer - Drop Down Issue -...

User 2283504 Photo


Registered User
36 posts

A couple pages disappeared but I have put them back so hopefully this will work this time.

Thank you for taking a look at this. In addition to the menu pushing content down I cannot get it to center.

The address is: www.acquirenewclients.com

Regards,

Bryon



Bryon K. Smith
User 2276240 Photo


Registered User
194 posts

I am far from an expert on these matters, but looking at your code, I am assuming that you added more to it then what is generated in the CSS Menu Designer. I have a test page I play with on my pc and I put up a quick menu with a drop down of 4 items and it has a lot less coding than you have in yours.

Here is what I got:
<div id="content"><ul class="menu-menu">
<li class="first"><a href="http://">Home</a></li>
<li>
<a href="http://">Corvette History</a>
<ul>
<li class="first"><a href="http://">C1 History</a></li>
<li><a href="http://">C2 History</a></li>
<li><a href="http://">C3 History</a></li>
<li><a href="http://">C4 History</a></li>
</ul>
</li>
</ul>
User 187934 Photo


Senior Advisor
20,271 posts

Try this Bryon.:)


<ul class="menu-menu">
<li class="first"><a href="index.com">Home</a></li>
<li>
<a>Services</a>
<ul>
<li class="first"><a href="direct_marketing.html">Direct Marketing</a></li>
<li><a href="marketing_strategy.html">Marketing Strategy</a></li>
<li><a href="social_media.html">Social Media</a></li>
<li><a href="website_development.html">Website Development</a></li>
<li><a href="multi_channel_marketing.html">Multi-Channel Marketing</a></li>
<li><a href="best_practices_review.html">Best Practices Review</a></li>
</ul>
</li>
<li><a href="about_us.html">About</a></li>
<li><a href="contact-us.html">Contact</a></li>
</ul>


I'm still looking at what's forcing your table down. A z-index maybe. Inger where you at?
Attachments:
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 122279 Photo


Senior Advisor
14,649 posts

The centering bit is easy. In the html you create a <div class="center"> and place it surrounding the menu, like this:
<div class="center">
<ul class="menu-menu">
<li class="first"><a href="http://">Untitled1</a></li>
<li><a href="http://">Untitled2</a></li>
<li><a href="http://">Untitled3</a></li>
<li><a href="http://">Untitled4</a></li>
<li><a href="http://">Untitled5</a></li>
<li><a href="http://">Untitled6</a></li>
<li><a href="http://">Untitled7</a></li>
</ul>
</div>


In the menu-menu.css create a .center:
.center {
width:700px;
margin: auto;
height: 50px;
border: 1px solid yellow;
}


You have to adjust the width to fit your own menu. The height and border are just in there to make it easier to find the right width. They can be deleted when you have got it the way you want.

Regarding the other problem, I'll have to look through the code when I'm awake enough. Right now it is nearly 02 at night, so that will have to be tomorrow.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 122279 Photo


Senior Advisor
14,649 posts

Eric Rohloff (Rolly) wrote:


I'm still looking at what's forcing your table down. A z-index maybe. Inger where you at?


As I said in my post above, I'm already asleep at 02am... ;)
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 187934 Photo


Senior Advisor
20,271 posts

Bryon I just looked a little closer at your source code. Try putting the html for the css menu in its own div like <div id="nav"> instead of the <div class="center"> . That way you can create the css for you navigation positioning.:)
Another thing I see is you have center and centered for your class in several places in your html but only center in the css.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 187934 Photo


Senior Advisor
20,271 posts

Bryon, This will get you a little closer. Add it to your current css.:)

div#nav{
text-align:center;
height:50px;
width: 700px;
border-top : none;
margin: auto;
border-bottom-style: none;
padding-bottom:5px;
}


/*** Page STYLES ***/
.center {
width:90%;
margin: auto;
height: 0px;
border: 0px;
}
.tablecenter {
width:90%;
margin-left: 50px;
margin-right:auto;
position:absolute;
}


Put your css menu in a <div id="nav">css menu code here</div>

Change your table <table class="center"> to <table class="tablecenter">
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2283504 Photo


Registered User
36 posts

Thank you all for the cleaner code. I made the suggested changes and it still doesn't center. Take a look and let me know if I missed something. I tried different values with the Z-Index to see if I could stop the menu from pushing the page content down when the menu has a sub menu but with no luck. In fact, now instead of pushing it down it pushes it to the side.

Attached is the menu.

Regards,

Bryon
Attachments:
Bryon K. Smith
User 1948478 Photo


Senior Advisor
1,850 posts

Bryon,
When I looked at it about an hour ago, your home page was nicely centered. But then you must have changed something again...?
You may be using conflicting advice from different people here...?
I'd suggest you go back to what you had an hour or two ago, - i.e. if you still remember what that was... ;)
User 2283504 Photo


Registered User
36 posts

I think I will start fresh tomorrow. And it looks like some of the changes I tried had unintended consequences in that it centered text but not the menu itself. I can go back but maybe when I get to it again tomorrow I will. be fresher and maybe I did something extraneous to what Inger and Eric suggested.

This is interestingly frustrating and fun at the same time.

Regards,

Bryon
Bryon K. Smith

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.