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.
>

Similar Messages

Webfonts in Dropdown menu Issue

Im using a webfont sucessfully with the exception of its appearance in my dropdown menu.
Thus far Ive not found any information on the proper method to address this issue.
Your help will be greatly appreciated

What's the URL to your problem page?
Without seeing your code & how you've implemented your custom fonts, it's impossible to help you.
Nancy O.

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

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.

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.

PS HTML Panel dropdown menu issue

copy from http://forums.adobe.com/message/4897323
Hello,
I have made a panel using Configurator which only contain a HTML loader, and now I'm in the process of creating my UI in HTML.
I need to reference all the shots of a production in a dropdown (combo) item. I have been using a <select></select> tag to do so. It does display correctly, but it's mostly unusable. If I click on it it will show the list but if I roll the mouse on the list (so rollout of the combobox) the list disappear.
The only way I can use the combo, is to right click on it to get the focus, and then use the arrow keys to go through all of them. This is not really the best experience. Any idea on how to solve this ?
cheers,
F.
Anyone would have a clue on how to proceed.

This is a bug of Flex HTML widget. Third part bug for Configurator, and Configurator can do nothing to fix it. If combox is necessary for you, you can create a combox with JS and <div>, rather than using <select></select>.

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

Rollover dropdown menu issue

helpppp!!!!
ok here's whats going on... i'm making a rollover drop down
menu for a site im creating for myself...
in fireworks, when i preview it... it works fine
when i try to preview the page or template in dreamweaver, it
doesn't work.
i'm fairly new with a lot of this stuff. i tried going to
insert rollover image and tried swapping between the .jpg file for
the menu and the .htm file for the menu. basically with the jpg
file, the rollover image works but no menu. when i use the .htm
file, a small box appears within the image button... which one am i
supposed to be using?
as for the mm_menu file which was created, am i supposed to
do anything with it or is it automatic?
thanks

What's the URL to your problem page?
Without seeing your code & how you've implemented your custom fonts, it's impossible to help you.
Nancy O.

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.
>

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

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?

Dropdown Menu CSS Style

Hi!
I am trying to create a dropdown menu in Dreamweaver. I have watched several tutorials and read many how-to guides and my html looks fine, but editing the style is really throwing me off. I am a beginner to Dreamweaver, so I am unsure of the properties I need to make this right. The code below, when I hover over the first button the dropdown menu goes behind the other two buttons. I need the dropmenu to go off to the side of the buttons and down. If not that, I can align the buttons to go horizontal, so they aren't being covered. I hope that makes sense.
Thank you in advance!!
-M
HTML
<div class="dropdown" id="dropdown" style="text-align: left;">
<ul>
        <li><a href="#">Americas</a>
           <ul>
                   <li><a href="#">Connecticut</a></li>
                    <li><a href="#">Ohio</a></li>
                    <li><a href="#">Vermont</a></li>
                    <li><a href="#">California</a></li>
                    <li><a href="#">Canada</a></li>
                    <li><a href="#">Brazil</a></li>
           </ul>
        </li>
</ul>
<ul>
       <li><a href="#">China</a>
             <ul>
                     <li><a href="#">China</a></li>
               </ul>
        </li>
</ul>
<ul>
        <li><a href="#">Europe</a>
            <ul>
               <li><a href="#">France</a></li>
               <li><a href="#">UK</a></li>
            </ul>
        </li>
</ul>
</div>
STYLE
#dropdown {
margin: 0;
width: 150px;
font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
#dropdown ul {
margin: 0;
padding: 0;
line-height: 30px;
#dropdown li {
    margin:0;
    padding:0;
    list-style:none;
    float:left;
    position:relative;
#dropdown ul li a {
text-align: center;
height: 30px;
width: 150px;
display: block;
color: #000;
text-decoration: none;
border: 1px solid #000;
text-shadow: 1px 1px 1px #000;
background: #CCC;
#dropdown ul ul {
position:absolute;
visibility:hidden;
top:32px;
font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
#dropdown ul li:hover ul {
visibility:visible;
position:absolute;
   #dropdown li:hover {
background: #7D92C6;
float: left;
    #dropdown ul li:hover ul li a:hover {
    color:#000;
    background:#7D92C6;
#dropdown a:hover {
color:#000;
background: #7D92C6;
.clearFloat {
    clear:both;
    margin:0;
    padding:0;

Are you doing this as an execise in learning or is it for a real website. I ask because if the latter why not just use a tested and proven commercial product and be done with it? I have used the PVII (http://www.projectseven.com) products for years and can't recommend them highly enough.

Align select dropdown menu on the right edge of parent box

Hello,
I was wondering if you can help me about an issue i have with Firefox browser.
I'm designing a webpage and i have a "<select>" menu with numerous options.
On Firefox the left edge of the dropdown menu aligns to the left edge of the
parent "<select>" box whereas in other browsers (Chrome, IE) aligns to the right.
The entire menu, is located on the right edge of my page
The result is when the innertext of an option is very long,
exceeds the margins of the page and is cut.
Is there any hidden option (css-fix), so that i could make dropdown menu align to
the right of the parent box , just like other browsers?
(I have some screenshots of the menu, but i don't know where to post them)
Thank you in advance!

Could you post your Screenshot and code.
There is "browse" icon above POST REPLY button, it helps to add your image.

Dropdown Menu Not Covering Side Navigation Menu

Hello,
I have a page with a top navigation bar that includes dropdowns and a side navigation bar. The problem I am having is that the dropdowns are not covering over the sidebar menu, but seem to be blending with it on the same level.
If you look at my page:
http://mymajesticwindow.com/testing/dhHighlights
go to PRODUCTS and you can see what is happening. Any ideas as to why this might happen? Not sure if this is a CSS or HTML issue so I included both below.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Majestic Windows</title>
<link href="css/majesticStyles.css" rel="stylesheet" type="text/css">
<link href="css/topNav.css" rel="stylesheet" type="text/css">
<link href="css/sideNav.css" rel="stylesheet" type="text/css">
<link rel="shortcut icon" href="favicon.png" />
</head>
<body>
<?php include("includes/header.php"); ?>
<?php include("includes/topNav.php"); ?>
<div id="content">
<?php include("includes/sidebarDH.php"); ?>
<div id="contentRight">
<div id="bodyCopy">
<h1>Majestic Signature Series <br>
    Vinyl Windows & Doors</h1>
<h5> </h5>
<h2>Designed to express the way you live your life, Majestic windows can help you create a home that is as unique as you are. There are many reasons to replace your old windows with new vinyl ones and Majestic windows make it easy.</h2>
   <h5> </h5>
<h2>Our vinyl windows are strong, durable, energy efficient and are all designed for performance, beauty, and dependability.
<h5> </h5>
    </h2>
<h2>Choose from a variety of sizes and styles including double-hung, casement, awning, bay, bow, and picture windows.</h2>
</div>
<div id="beautyShot">
<img src="images/index/indexBeauty.jpg" width="380" height="373" alt="Beauty Shot">
</div>
</div>
<div id="indexBodyBottom">
<div id="dealerButton">
<a href="dealer"></a>
</div>
<div id="litDownloadText">
<strong><a href="literature">Download the Majestic Brochure</a> </strong></div>
<div id="litImage"><a href="literature"></a>
</div>
</div>
</div>
<?php include("includes/footer.php"); ?>
</body>
</html>
topNav CSS:
/* main menu bar */
ul#menu {
    margin: 0;
    padding: 0;
/* submenu2 no appear on first level hover */
#menu li:hover ul ul {
    display: none;
/* main menu */
ul#menu li {
    list-style-type: none; /* no bullets */
float: left; /* keeps horizontal */
position: relative; /* keeps in line */
/* main menu links not hovered */
ul#menu li a {
    color: #FFFFFF;
    display: block;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 14px;
    line-height: 28px;
    padding: 5px;
    text-align: center;
    text-decoration: none;
/* submenu individual items */
ul#menu ul.sub-menu li {
    background-color: rgba(52, 85, 56, 0.9);
    border-top: 1px solid #FFFFFF;
    list-style-type: none;
float: none; /* keeps blocks even */
/* entire submenu */
ul#menu li ul.sub-menu {
    display: none;
    left: -20px;
    position: absolute; /* keeps menu from pushing down content - goes over it */
    top: 38px;
    width: 165px;
/* submenu links not hovered */
ul#menu li ul.sub-menu li a {
    line-height: 19px;
    padding: 10px;
/* shows submenu on hover */
ul#menu li:hover ul.sub-menu {
    display: block;
/* all links */
ul#menu li a:hover {
    color: #CCCCB4;
-webkit-transition: color 200ms ease;
-moz-transition: color 200ms ease;
-ms-transition: color 200ms ease;
-o-transition: color 200ms ease;
transition: color 200ms ease;
/* entire submenu2 block */
ul#menu ul.sub-menu li ul.sub-menu2 {
    left: 126px;
    position: absolute;
    text-align: center;
    top: 0;
    width: 165px;
/* shows submenu2 on hover */
ul#menu ul.sub-menu li:hover ul.sub-menu2 {
    display: block;
sideNav CSS:
#sidebarGrad{
width: 245px;
height: 497px;
background: rgb(134, 100, 63);
background: -moz-linear-gradient(270deg, rgb(134, 100, 63) 30%, rgb(184, 159, 125) 100%);
background: -webkit-linear-gradient(270deg, rgb(134, 100, 63) 30%, rgb(184, 159, 125) 100%);
background: -o-linear-gradient(270deg, rgb(134, 100, 63) 30%, rgb(184, 159, 125) 100%);
background: -ms-linear-gradient(270deg, rgb(134, 100, 63) 30%, rgb(184, 159, 125) 100%);
background: linear-gradient(0deg, rgb(134, 100, 63) 30%, rgb(184, 159, 125) 100%);
ul#menuSide {
    padding-top: 43px;
padding-left: 0;
margin-right: 32px;
margin-left: 32px;
margin-top: 0;
list-style:none;
position: relative;
ul#menuSide li {
font-family: Arial, Helvetica, sans-serif;
font-size: 15px;
color: #F5F5EC;
height: 37px;
line-height: 37px;
text-align: right;
ul#menuSide li a {
font-family: Arial, Helvetica, sans-serif;
font-size: 15px;
color: #F5F5EC;
display: block;
padding-right: 20px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #F5F5EC;
ul#menuSide li a:hover {
color:#A21029;
border-bottom-color: #A21029;
text-decoration: none;
-webkit-transition: color 300ms ease;
-moz-transition: color 300ms ease;
-ms-transition: color 300ms ease;
-o-transition: color 300ms ease;
transition: color 300ms ease;

I found my own answer to this one. I did some more research and added the z-index: 9999; property to ul#menu li ul.sub-menu. Worked perfectly!

Why won't cells autopopulate when using numbers on the ipad? Anyone have a fix? Have also created a dropdown menu, but that does not translate from excel to numbers either.

Why won't cells autopopulate when using numbers on the ipad as they will in excel? Anyone have a fix? I have also created a dropdown menu in excel, but that does not translate from excel to numbers either.

Glad you got it sorted out.
Diane123456 wrote:
> Thanks Vix, Joe, and Mad Dog for responding, the site is
in
> development so it's behind a password, which I probably
could share
> but MD is right, it was a margin issue. I didn't think I
needed to
> set a margin but I had to put a left margin of 2em on it
for the
> numbers to display on IE7 or IE6
>
> This is actually a rather common issue with CSS layouts
(it is not an
> issue with designs using tables) - there are several
posts for ULs
> which you may be interested in - see
>
>
http://www.adobe.com/cfusion/communityengine/index.cfm?event=showdetails&postId=
> 1981&productId=1&loc=en_US
>
> -- and once I got the numbers to show I ran into the
same problem as
> the commenters on the above thread, which noticed that
the vertical
> alignment doesn't work well with IE, and which noted
that apparently
> IE has a stutter because it just kept repeating "1" "1"
"1" -- so I
> finally went with a hanging indent and just put the
numbers in there
> manually - fortunately it's not a long list.... if you
have a fix
> for the stutter, or know of another place to get help
with CSS layout
> browser quirks please share -- if I find another one
I'll share also
>
> thanks again, Diane

CSS Dropdown Menu Issue in Contribute

Similar Messages

Maybe you are looking for