Dw6 css dropdown menu help

wanting to create a drop down menu using css. i have created this using <ul> and <li> tags, but for some reason it doesn't look right. My html seems to be correct and I have double checked the css and can't seem to find what i did wrong. I have chosen the tags within a tag to be hidden, the text is hidden but the boxes are still shown. can someone help out a rookie and see what i screwed up?
url is vacationcribs.com
thx.\

Fix the ending list tag (</li>) and come back here if it is still no good.
This list should help.

Similar Messages

IE 7 - CSS Issues with Spry dropdown Menu *HELP*

I am using a spry horizontal dropdown menu generated in DW. The menus look consistant in all other browsers except ie7 - When the drop down menu occurs they all appear to the right and not directly under its menu item.. Looked around in the Css and i cant seem to find the right rule to make the change in ie7 only... was planning on using a css conditional statement to shift them left.. But im not having any luck.. HELP!
Thanks so much in advance!

Sorry.. Here is the link.. Thanks so much for your willingness to help!
http://soldesign.us/_working/WEBSITE_BoulderPlasticSurgery/index.html

Toggle Dropdown Menu, Help Please

I have this CSS below, and it works like a charm for what it's supposed to do, but I noticed that the dropdown menu only comes down when the mouse hovers over the button. I want it so that it only drops down when clicked on, allowing the user to toggle the menu off and on. The menu and dropdown menu I'm talking about only shows up on my phone layout of the site. How do I make this dropdown menu drop on toggle instead of mouse hover.
.phonemenuwrap {
    width:100%;
    box-shadow:0px 1px 3px rgba(0,0,0,0.2);
    background:#3e3436;
.phonemenu {
    width:100%;
    margin:0px auto;
    background:#89181A;
.phonemenu li {
    margin:0px;
    width:100%;
    list-style:none;
    font-family:Arial, Helvetica, sans-serif;
    background:#2e2728;
.phonemenu a {
    transition:all linear 0.15s;
    color:#919191;
.phonemenu li:hover > a, .phonemenu .current-item > a {
    text-decoration:none;
    color:#be5b70;
.phonemenu .arrow {
    font-size:11px;
    line-height:0%;
/*----- Top Level -----*/
.phonemenu > ul > li {
    float:left;
    display:inline-block;
    position:relative;
    font-size:19px;
.phonemenu > ul > li > a {
    display:inline-block;
    text-shadow:0px 1px 0px rgba(0,0,0,0.4);
.phonemenu > ul > li:hover > a, .menu > ul > .current-item > a {
    width:100%;
    background:#2e2728;
/*----- Bottom Level -----*/
.phonemenu li:hover .sub-menu {
    z-index:1;
    opacity:1;
.sub-menu {
    width:100%;
    padding:5px 0px;
    position:absolute;
    top:100%;
    left:0px;
    z-index:-1;
    opacity:0;
    transition:opacity linear 0.15s;
    box-shadow:0px 2px 3px rgba(0,0,0,0.2);
    background:#2e2728;
.sub-menu li {
    width:100%;
    display:block;
    font-size:16px;
.sub-menu li a {
    padding:10px 30px;
    display:block;
.sub-menu li a:hover, .sub-menu .current-item a {
    background:#3e3436;
My site: Showcase Design & Build: Pinehurst, Fayetteville and Sanford Custom Home Builder

Hyde1216 wrote:
Still doesn't seem to be working, even after doing all of the above. The problem is still that the menu either stays dropped down, or it never gets dropped down.
Ok lets go through this again. I made an error in my orignal code and I now have had a better chance to unravel your css.
1) Comment out the css selector as shown below using /* */
.phonemenu li:hover .sub-menu {
z-index:1;
opacity:1;
2) Comment out the 'opacity: 0;' as shown below using /* */
.sub-menu {
    width:100%;
    padding:5px 0px;
    position:absolute;
    top:100%;
    left:0px;
    z-index:-1;
    /* opacity:0; */
    transition:opacity linear 0.15s;
    box-shadow:0px 2px 3px rgba(0,0,0,0.2);
    background:#2e2728;
3) Add the jQuery framework library and script - copy the below code and paste it into your pages code directly before your closing </head> tag. (NOTE: I have added - $('.sub-menu').hide(); - to hide the submenu when the page loads).
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$('.sub-menu').hide();
$('.openMobileMenu').click(function() {
$('.sub-menu').toggle();
</script>
4) Add class="openMobileMenu" to the a tag which is wrapping your 'dropdown.png' image, as shown below.
<a href="#" class="openMobileMenu"><img src="images/dropdown.png" width="36" height="27" alt="Dropdown"><span class="arrow">▼</span></a>
Thats it - your phone menu should now toggle when the hamburger icon is clicked.
EDITED: ALSO don't use a minus z-index for the 'sub-menu' - use a higher number like 10, as shown:
.sub-menu {
    width:100%;
    padding:5px 0px;
    position:absolute;
    top:100%;
    left:0px;
    z-index: 10;
    /* opacity:0; */
    transition:opacity linear 0.15s;
    box-shadow:0px 2px 3px rgba(0,0,0,0.2);
    background:#2e2728;

Long Vertical CSS dropdown menu goes off screen

Greetings,
I developed a dropdown menu using Spry (Adobe Dreamweaver). It is a vertical menu with multiple sub-menus. Some lists are very long and the menu goes below and off the page.
I found a great example of what I want my menu to do: http://coins.shop.ebay.com/
On the side, it says "Browse By:" and there is a vertical menu. If I shrink the page up vertically a little and watch the sub-menus pop out, I notice they get pushed up if the parent is close to the bottom of the screen, which ensures that none of the options go off the page, they get pushed up.
How can this be done?
Thanks

Have a look here http://pleysier.com.au/mike/
Maybe this is for you.
For the accordion I have used jQuery UI Accordion for Widget Browser which can be found here http://emea-events.wip4.adobe.com/cfusion/exchange/index.cfm?event=ext ensionDetail&loc=en_us&extid=2028523
If you are using DWCS4 or 5, then you can easily incorporate the widget, if not then it is a matter of copying and pasting the code.
Gramps

Dropdown menu help

Hello,
I am updating my website, and created a dropdown menu using fireworks. (later I installed it into dreamweaver, but I'm not sure that that makes any difference) The problem I am having is that each item in the dropdown menu opens in a new tab when I click it, and I want it to stay in the same window. My site is here: www.nicolemn.com
Any suggestions on how I can fix this?
Thank you.

That code is awful! How in the world do you expect to maintain this code with names like these? Using Fireworks code for a live site (rather than building in Dreamweaver, for example) is just asking for trouble.
Here's your menu code:
<a id="MMMenu0120182959_0_Item_0" class="MMMIFVStyleMMMenu0120182959_0" onmouseover="MM_menuOverMenuItem('MMMenu0120182959_0');" target="Home" href="http://www.nicolemn.com/home.html"> Home </a>
<a id="MMMenu0120182959_0_Item_1" class="MMMIVStyleMMMenu0120182959_0" onmouseover="MM_menuOverMenuItem('MMMenu0120182959_0','1');" target="Photography" href="http://www.nicolemn.com/photography.html"></a>
<a id="MMMenu0120182959_0_Item_2" class="MMMIVStyleMMMenu0120182959_0" onmouseover="MM_menuOverMenuItem('MMMenu0120182959_0');" target="Design" href="http://www.nicolemn.com/design.html"> Design </a>
<a id="MMMenu0120182959_0_Item_3" class="MMMIVStyleMMMenu0120182959_0" onmouseover="MM_menuOverMenuItem('MMMenu0120182959_0');" target="About" href="http://www.nicolemn.com/about.html"> About </a>
<a id="MMMenu0120182959_0_Item_4" class="MMMIVStyleMMMenu0120182959_0" onmouseover="MM_menuOverMenuItem('MMMenu0120182959_0');" target="Contact" href="http://www.nicolemn.com/contact.html"> Contact </a>
<a id="MMMenu0120182959_0_Item_5" class="MMMIVStyleMMMenu0120182959_0" onmouseover="MM_menuOverMenuItem('MMMenu0120182959_0');" target="Link" href="http://www.nicolemn.com/links.html"> Links </a>
Answer to your question:
Your trouble is with these bits in the code above:
target="Home"
target="Photography"
target="Design"
target="About"
target="Contact"
target="Link"
The target attribute has to do with what window the link opens in. You have each link open in a new named window (not a standard thing to do). See this description: http://www.developingwebs.net/html/targetattribute.php You need to remove the target attributes in the section of code I quoted and anywhere else you're using them inappropriately.
Optional stuff:
You might also consider whether or not each link needs its own id and if a more memorable class name ("mainnav" perhaps?) might be better than "MMMIFVStyleMMMenu0120182959_0."
I'm not a fan of your menu only showing up if the user mouses over your logo. What if the user never does that? You're pinning your hopes and expectations on a random user behavior. That's poor usability. Navigation should be clear, not hidden. Also, users dislike splash pages, as it's extra time needed to load a page that has no content on it. It's a barrier to content and the Web is all about access to content.

Adding a link to a CSS Dropdown Menu

Hello all:
I am fairly new to the world of CSS and am having some
trouble. I found a CSS menu online and styled it to look correctly.
But now I need to add some functionality to it and can't quite get
my head around how to do this (trial and error has not been working
=)
If you take a look at the following link, I would like to
creat a link out of each of the big square buttons. "Specials",
"Chicago Souveniers", etc.
http://gdsquared.com/clients/souvenir/mm5/home.htm
The corresonding CSS file can be viewed at this link. The
beginning of the navigation bar is commented out as, ----- NAV:
START------
http://gdsquared.com/clients/souvenir/css/style.css
Currently when I add a href into the <li> it starts to
take on the properties of the submenus.
If someone could offer any help, it would be greatly
appreciated.
Thank you
- Garrett

"gbowhall" <[email protected]> wrote in
message
news:ff3uvd$1ko$[email protected]..
>I believe I followed the logistics of what you were
saying, but I didn't
>quite
> figure out how to apply that to splitting them up. How
do I pull them
> apart
> from each other (if that's what you were implying) so I
can make each its
> own
> separately styled link? I apologize for my newbie-ness
here.
You don't pull them apart, it's the opposite, you need to
*nest* them
properly
<ul>
<li>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</li>
<li>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</li>
<li>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</li>
</ul>
As you can see, the sub-menus need to be within LIs. ULs do
not "sit" next
to each other inside the main UL
Thierry
Articles and Tutorials:
http://www.TJKDesign.com/go/?0
http://www.divahtml.com/products/scripts_dreamweaver_extensions.php
- divaGPS - Add "you are here" highlighting to virtually any
menu
- divaFAQ - Create FAQ pages that toggle (show/hide) the
answers
- divaPOP - Easy, clean, standards-compliant popup windows.

CSS Dropdown Menu Issue in Contribute

Hello everyone,
My name is Boris and I have these question related to the
Adobe Contribute.
I'm working on a client web site where there is a CSS drop
down menu that works in all the browsers. Which works perfectly in
all the browsers without use of JavaScript. However, the issue
comes when you use Contribute and it simply shows the entire drop
down menu all incorrectly and overall design gets all wrong because
of that. I was wondering if anyone had similar problem and has a
solution for it or if there is a way to make code hidden just to
Contribute?? I would very much welcome any help with this issue.
Thank you everyone and have a great weekend. :-)

I've figured it.
Just so anyone else who is experiencing this knows - i
changed all the
margin-left properties to just 'left' and made the position
relative. For
some reason Contribute didn't recognise the margin-left
property at all.
Strange. It now displays exactly the same in dreamweaver,
contribute, ie,
firefox...etc.
Thanks for your post Lime.
"lime" <[email protected]> wrote in message
news:e26u9n$jqr$[email protected]..
> "James D" <[email protected]> wrote in
message
> news:e26b7m$rv8$[email protected]..
>> Hi there,
>>
>> I have a template page which is based purely in CSS
and I need that
>> template
>> to be used by my client in Contribute, the only
problem is that when page
>> is
>> previewed in Contribute the layers are all on top of
each other in one
>> line
>> making it impossible for client to update. In
Dreamweaver the preview is
>> fine.
>>
>> I dont have access to the code at the moment as i am
away from the
>> office,
>> but has anyone experienced a similar thing before or
is there a common
>> explanation like contribute cannot handle pure css?
>>
>> Thanks
>>
>>
>
> Yeah, I've seen Contribute present CSS layers in an odd
way as well - not
> as bad as yours sounds though. I'm also not sure how to
help... anyone
> else?
>
> --
> Helen, lime, et al.
>

Dreamweaver Template & CSS Dropdown Menu Problem

The following website (K
WEBSITE ) is up and as you can
see, dropdowns work fine in Firefox and IE 7, but only work on home
page in IE 6. Seems to be a template problem... not sure. The
dropdowns do not even show up!
Can anyone help, please!!! I am going nuts with this.
Thank you,

Try adding display:inline-block to your nav ul rule:
nav ul {
    display:inline-block;
    margin: 0;
    padding: 0

CSS - Vertical Dropdown Menu

Hey guys.
I need the CSS for a vertical menu much like the one on the
Adobe Homepage under 'Products and
Solutions' where more data is revealed when the title is scrolled
over.
If anybody has links to a tutorial or even have one of these
menus I could possibly have a look at it would be much appreciated.
Cheers in advance.

Hello,
This is a nice CSS dropdown menu tutorial:
http://projectseven.com/tutorials/navigation/auto_hide/index.htm
And another:
http://www.tjkdesign.com/articles/dropdown/
example of menu:
http://www.tjkdesign.com/articles/keyboard_friendly_dropdown_menu/EK.asp
Take care,
Tim
"ForensicBop" <[email protected]> wrote in
message
news:g54p5j$nke$[email protected]..
> Hey guys.
>
> I need the CSS for a vertical menu much like the one on
the Adobe homepage
> under 'Products and Solutions' where more data is
revealed when the title
> is
> scrolled over.
>
> If anybody has links to a tutorial or even have one of
these menus I could
> possibly have a look at it would be much appreciated.
>
> Cheers in advance.
>

CSS (Responsive) Horizontal Dropdown Menu (Alignment)

I am styling a Responsive CSS Horizontal Dropdown Menu (for hours now), and can not get the main menu headings (Directory, Resources, etc) to align left (even) with the logo and content divs. I would also like the submenu headings (Learning & Games) and items (Catch the Bullet, Snoopydoo, etc) to align left (even) with the logo and content divs. - Like I am trying to do with the main headings. --I am trying to get the logo, main menubar heading, and menubar subheading to all align the same left.
(Optional) I am considering on not having the gray menuboard span the whole screen when opened. Not sure if this would look good, but even more unsure how to keep it in the 90% container the menubar is located in.
Here is the site for code:
http://dothopper.com/index.html
Thanks for any help.

Another great tip. Never cease to amaze. Thanks . I uploaded the new CSS with red border and looked at somewhat. It seems very helpful, but like this navbar, I'm gonna have to spend some time with. I think this may help me to figure the problem. This is a really GREAT trick, thanks. If you appen to look at my site, and see anything relevant to getting the element to shift left, let me know.
BTW, crammed some more learning recently (Mostly Dreamweaver, little HTML STructure, and JQuery). Going to try to not use as many divs, (use HTML tags and class selectors). Trying to use captions in my HTML and CSS for organization and understanding. Making copies of all my CSS, JS, and HTML. Set my areas (divs) up as 'section,aside,article,and footer'?--Tried adding metatag info (I think I missed 1 part of the metatag (they wanted a value?). Not sure if my metatagging is correct? Let me know of any advice what I'm doing right/wrong so far.
I taught myself to design using divs like tables somehwat. With the correct way of design (not using alot of divs)..how would I handle this?...
My old page (method), I had several,divs: 3- (content75%) and 3- (image25%) all housed within a div (approx 900px). Content was left, and images right. Total DIV that housed them was 75% of 1232px page? (I think)..The div that housed them was approx 900px (.75x1232). Content approx 675px and image approx 225px wide.
I inseted 480px wide images in that 25% image div and it showed it nicely as approx 225px wide on desktop, and when responsive on mobile, nice full size at 480px. (I think I am/was avoiding having to use alternative images--for each platform-- this way?)
With the correct way of designing (less divs), how would I handle this scenario above? IF I inserted a 480px image into a approx 900px div with no other divs, it would fill the div with a 480px image. IT would then throw my wole design off. I think I'm just missing some HTML/CSS knowledge. Hope this question makes some kind of sense?

Help Needed in creating dropdown menu in excel using JXL

Hi,
I am trying to create dropdown menu in using JXL.
The Code:
private void createRequiredRows(WritableSheet writableSheet, List unallowCodeList,int rowCount
               , int startRowNo,int colCount) throws WriteException {
Label unallowCode = null;
          WritableFont noBoldFont = new WritableFont(WritableFont.ARIAL, 8,WritableFont.NO_BOLD);
          WritableCellFormat dropDownCellFormat = new WritableCellFormat(noBoldFont,new NumberFormat("000"));
          dropDownCellFormat.setAlignment(Alignment.RIGHT);
          WritableCellFeatures writableCellFeature = new WritableCellFeatures();
          writableCellFeature.setDataValidationList(unallowCodeList);
          for (int rowNo = startRowNo; rowNo < startRowNo + rowCount; rowNo++) {
               unallowCode = new Label(colCount, rowNo, "Select",dropDownCellFormat);
               unallowCode.setCellFeatures(writableCellFeature);
               writableSheet.addCell(unallowCode);
it creates a drop down in the Excel.
But writableCellFeature.setDataValidationList(unallowCodeList); has a limitation of characters .So the dropdown menu gets truncated when it exceeds the limitation.
Can anyone help me in creating dropdown menu in excel without any limitation using JXL..
Thanks,
Bisin

Hi,
I dont know the solution for this, but heres a work arround
//create new label some where else in the excel sheet as shown below
Label lblcmbdata;
for(int i=0; i<1000; i++)
             lblcmbdata = new Label(75, i, (i+1)+" satish", format);
             sheet1.addCell(lblcmbdata);
}//set the validation range as shown below
writableCellFeature.setDataValidationRange(75,0,75,1000);
Label cmb = null;
cmb = new Label(0, 1, "Select",format);
cmb.setCellFeatures(writableCellFeature);
sheet.addCell(cmb);this will create a combo list with 1000 values
also you can keep the data to be populated in the different sheet in same workbook by creating a named range as below
workbook.addNameArea("cmbdata", sheet1, 0, 0, 0, 1000);
// then fill the data in sheet1
Label lblcmbdata;
for(int i=0; i<1000; i++)
                lblcmbdata = new Label(0, i, (i+1)+" satish", format);
                sheet1.addCell(lblcmbdata);
//set the validation named range as below
writableCellFeature.setDataValidationRange("cmbdata");
Label cmb = null;
cmb = new Label(0, 1, "Select",format);
cmb.setCellFeatures(writableCellFeature);
sheet.addCell(cmb);Thanks and Regards
Satish

Why is help missing from help dropdown menu?

Why is help missing from Ps CC help dropdown menu in preferences?

bumpkin wrote:
Why is help missing from Ps CC help dropdown menu in preferences?
???? I see help being shown in some of Photoshop preferences pages but both of you questions confuse me.

On Firefox, I select one of my usual sites on the URL dropdown menu but the page does not load. Please help!

I click on the Firefox icon on the bottom of my toolbar screen. I go to the URL dropdown menu for my usual sites; I select one but the page will not load and the URL field is blank. It is a hassle to press the up and down arrows to select the site. Please help!

Start Firefox in <u>[[Safe Mode|Safe Mode]]</u> to check if one of the extensions (Firefox/Tools > Add-ons > Extensions) or if hardware acceleration is causing the problem.
*Switch to the DEFAULT theme: Firefox/Tools > Add-ons > Appearance
*Do NOT click the Reset button on the Safe Mode start window
*https://support.mozilla.org/kb/Safe+Mode
*https://support.mozilla.org/kb/Troubleshooting+extensions+and+themes

When i click on 'Show all in Finder' after searching for anything on spotlight, NOTHING happens! No Finder window opens up and the spotlight dropdown menu just shuts! Please help!

When i click on 'Show all in Finder' after searching for anything on spotlight, NOTHING happens! NO Finder window opens up and the spotlight dropdown menu just shuts! Please help!

I'm having the same problem in other places as well, for example when i downloaded Easyfind right now, clicking the small magnifying glass button on the right of the file name (shown below) would usually open up finder highlighting the file, but now nothing happens when i click on that button!
Is there a solution for this, as this was a very useful feature which i used ALL the time?

HELP: Javascript dropdown menu

Hi all,
i am currently developing a website which is all ready to be
uploaded but
cant because of a javascript dropdown menu.. I have a flash
slideshow in the
center and on the rightside are 6 images (mainlinks) one
below the other.
Some of these mainlinks have sublinks which need to be
displayed as
dropdowns. The dropdown needs to be as Javascript for easy
future
changes/additions and not in flash.
I visited many websites - javascripts.com / simplythebest /
dynamicdrive
/hotscripts and many other sites..but failed to find a
suitable, easily
editable and compatible script..
REQUIREMENT -
1) dropdown menu on image Mousever
2) The script should have/allow to set the respective x,y
(left,top) values
which some scripts lack.
3) Compatible for IE and Firefox
The only 1 compatible and easy editable script i had was
mm_menu by Andy
Finnell. But sadly the script is missing something and giving
errors.
PLEEASE HELP//
thanx

if you're using flash 8 you can use the externalinterface
class. otherwise, the best you can do is very much browser
dependent.

Dw6 css dropdown menu help

Similar Messages

Maybe you are looking for