0 Replies Latest reply on Sep 24, 2013 5:50 AM by Marco_ALEX

    fireworks cs6 drop down menu crossbrowser

    Marco_ALEX Level 1

      Hi there,,

      I am doing this drop down menu on fireworks cs6,its a horizontal menu,  and the dropdouwn menus on chrome appears on the middle of the button, the same happends on iexplorer,firefox and Opera.But on Safari it works perfectly.I send the fotos on atachment one  from google chrome and one from Safari.uploadschrome.pnguploadssafari.png

      The one on the left is from google chrome, the drop down menu on all the buttons appears on the midle of the button,and its the same on all browsers,except on safari, the right foto.

      I tryed to use google chrome inspect tools and uncheck some of the css proprieties of the div correspondent to the uploads drop down link("uploads"), but nothing happends.it doesnt move up or down , not even a pixel.

      I want it to look like the Safari right foto on all browsers, How can i do that?

      i did the menu on fireworks cs6 and exported to dreamweaver cs6 as HTML, then i inserted the menu as fireworks html inside a div #nav, this is on the fluid grid layout on the  phone and tablet css:

       

      #nav {

                margin-top: 0px;

                clear: both;

                float: left;

                margin-left: 0;

                width: 100%;

                height: auto;

                min-height: 180px;

                display: block;

                background: rgba(66,65,66,1);

                background: -moz-linear-gradient(top, rgba(66,65,66,1) 0%, rgba(115,115,115,1) 2%, rgba(168,168,168,1) 57%, rgba(247,246,247,1) 97%, rgba(253,252,253,1) 100%);

                background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(66,65,66,1)), color-stop(2%, rgba(115,115,115,1)), color-stop(57%, rgba(168,168,168,1)), color-stop(97%, rgba(247,246,247,1)), color-stop(100%, rgba(253,252,253,1)));

                background: -webkit-linear-gradient(top, rgba(66,65,66,1) 0%, rgba(115,115,115,1) 2%, rgba(168,168,168,1) 57%, rgba(247,246,247,1) 97%, rgba(253,252,253,1) 100%);

                background: -o-linear-gradient(top, rgba(66,65,66,1) 0%, rgba(115,115,115,1) 2%, rgba(168,168,168,1) 57%, rgba(247,246,247,1) 97%, rgba(253,252,253,1) 100%);

                background: -ms-linear-gradient(top, rgba(66,65,66,1) 0%, rgba(115,115,115,1) 2%, rgba(168,168,168,1) 57%, rgba(247,246,247,1) 97%, rgba(253,252,253,1) 100%);

                background: linear-gradient(to bottom, rgba(66,65,66,1) 0%, rgba(115,115,115,1) 2%, rgba(168,168,168,1) 57%, rgba(247,246,247,1) 97%, rgba(253,252,253,1) 100%);

         filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#424142', endColorstr='#fdfcfd', GradientType=0 );

                padding: 0px;

      i used a http://www.cssmatic.com/  linear gradient as background for the div #nav and i also tryed to remove the background and still the problem remains,except on safari.

      On fireworks cs6 preview in browser(chrome) it also works perfectly, its only wen i export it to dreamweaver it only works like the preview on Apple safari.